Jump to content

Why is heading overlapped by Div above it, despite 2em margin

Recommended Posts



I am trying to style this page:




and for the life of me, I cannot figure out why the H1 heading,

Learn French Online Free with Mots de L’actu

is partly obscured by the right floated div above it. I have tried putting 2em of bottom margin on the Div above, and then tried putting top margin on the Div containing the Heading. It works fine in Dreamweaver outside of Wordpress so I suspect the CSS is right, but inside of Wordpress, the heading slips under the Div above it. It's driving me crazy. I'm not expert, but this seems to be coded correctly.


Here's the code:

<div style="float: left; width:360px; height:467px;"><h2 style="text-align: center;">Top Stories: Le Progres</h2>[Wordpress shortcode for an advanced iFrame]</div><div style="float: right; width:517px; height:560px; margin-bottom: 2em;"><h2>Funny Helps Learning</h2>[Wordpress shortcode for an advanced iFrame}</div><div style="float: left; clear: both;"><h1 style="text-align: center; color: #0b00dd;">Learn French OnlineFree with Mots de L'actu</h1>TEXT</div>

Can anyone help me. I'm green, but not too green.




Link to post
Share on other sites

It isn't just one image. There is a pile of divs there such as b-infos-wrp. You should search the CSS for absolute or relative positioning because that is usually how something ends up on top of something else.

Link to post
Share on other sites

It isn't about an image.


Here's the answer I got from another forum:


<div id="ai-div-news7"> is set to height 560px as is its parent div, but above #ai-div-news7 there is an <h2> that is forcing #ai-div-news7 down.




<div style="float: right; width:517px; height:560px; margin-bottom: 2em;"> to <div style="float: right; width:517px; margin-bottom: 2em;"> fixes the problem.



Apparently the Div pushed down the iframe's content. When I take away a specific height, it allows the div to set its own height. I understand some, but not all of it. Thanks for your comment.



Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...