Cascading sections

Hi there,

On this page https://thelanguagesherpa.com/novels-russia/ there is this strange effect going on where each section seems to be getting narrower and narrower than the one before it. I don’t know why this is happening as it’s not at all how it looks in Cornerstone.

Also, I just noticed, none of the links are clickable for some reason…

Do you know what’s going on here?

Thank you!
LS

Hello There,

Thanks for writing in! I have checked your page and it seems that you have inserted an unclosed html code. Please edit your page and make sure that your custom html code is valid and correct. It must be closed properly like:

<span>some text here </span>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer scelerisque eros eu pulvinar dictum. Nunc egestas massa at elit bibendum, cursus fringilla nunc faucibus. Proin dignissim efficitur nunc a cursus. </p>

Hope this helps. Please let us know how it goes.

Hi Rue,

I have gone through the page and it did seem that there were one or two unclosed html codes. However, fixing them doesn’t seem to have made any difference…

I will attach login details in case that is helpful.

LS

Hi There,

You can use this page: https://www.freeformatter.com/html-formatter.html#ad-output to correct your HTML code.

The correct format should look like this:

<div style="height:370px; overflow:auto;">
	<p><a target="_blank" href="https://www.amazon.com/gp/product/B00H20A4SO/ref=as_li_tl?ie=UTF8&amp;camp=1789&amp;creative=9325&amp;creativeASIN=B00H20A4SO&amp;linkCode=as2&amp;tag=eurasianwhisp-20&amp;linkId=2a45ff0531a8bddd07e4d57ddae707e0" rel="noopener"><img border="0" src="//ws-na.amazon-adsystem.com/widgets/q?_encoding=UTF8&amp;MarketPlace=US&amp;ASIN=B00H20A4SO&amp;ServiceVersion=20070822&amp;ID=AsinImage&amp;WS=1&amp;Format=_SL350_&amp;tag=eurasianwhisp-20" class="alignleft" /></a><img src="//ir-na.amazon-adsystem.com/e/ir?t=eurasianwhisp-20&amp;l=am2&amp;o=1&amp;a=B00H20A4SO" width="1" height="1" border="0" alt="" style="border: none !important; margin: 0px !important;" />“I am Moscow’s underground son, the result of one too many nights on the town.”</p>

	<p>So begins <a href="https://amzn.to/2HRwLxr" target="_blank" rel="noopener">Hamid Ismailov’s tragic tale</a> of Mbobo, an Afro-Russian boy struggling to survive in Moscow during the painful transition from the Soviet Union to modern day Russia.  Constantly confronted with racism, domestic violence, and neglect, Mbobo spends his days wandering around the subterranean labyrinth of the Moscow metro, looking for meaning and belonging.</p>
	<p><em>The Underground </em>is a sad indictment of society that has itself suffered so much that it can no longer feel empathy for even its most vulnerable members.</p>
</div>

Hope it helps :slight_smile:

Hi Thai,

I did what you suggested but the problem is still there.

LS

Hi there,

There are many causes, one is this

<a href="https://thelanguagesherpa.com">Language Sherpa<a>

It should be like this

<a href="https://thelanguagesherpa.com">Language Sherpa</a>

Anothe example is this content,

<div style="padding: 25px; line-height: 1.4; text-align: center;">Enter your name and email address to subscribe to Language Sherpa and receive notifications of new posts by email<p>[email-subscribers namefield="YES" desc="" group="Public"]</div>

You added <p> but </p> is nowhere to be found.

There are many broken elements in your sites that needs fixing. You can see them here https://validator.w3.org/nu/?doc=https%3A%2F%2Fthelanguagesherpa.com%2Fnovels-russia%2F. I recommend contacting a developer to cleanup your site’s content. Broken HTML elements could lead to layout issues, like section will be place under another section with padding, hence, nested sections.

Thanks!

Hi Rad,

I had a second look and I found the code that was causing the nesting problem - so that is now sorted.

However, I noticed that the first three book images have clickable links, but the last two can’t be clicked on for some reason.

Can you see why this is the case?

Thank you,
LS

Hi There,

This charater is incorrect in this HTML code: <div style="height:370px; overflow:auto;”>

I’ve replace it with the " character and the images are clickable now.

Cheers!

Thank you, Thai

1 Like