Jump to content
Sign in to follow this  
Darkness

Floating Divs

Recommended Posts

I have a floating div, similar to:<div style='float: left; margin: 3px; background-color: yellow; width: 80px; height: 80px;'></div>That displays a yellow block with the dimension 80x80.However, if I try to do something such as (which I want to be displayed under the first block:<div style='float: left; margin: 3px; background-color: yellow; width: 80px; height: 80px;'></div><br /><div style='float: left; margin: 3px; background-color: yellow; width: 80px; height: 80px;'></div>...The second block just moves down a bit, but stays to the right of the first block.Any way to resolve this?Thanks!

Share this post


Link to post
Share on other sites

put this between the two blocks.<div style='clear: both'> </div>this is to stop the floating after the first div.

Share this post


Link to post
Share on other sites

There is no need to add the non-semantic div in this case. Add clear:both to the CSS of the second div.(I assume there's a reason to be floating them in the first place? Like more page elements than you have shown? Because otherwise, the divs will end up where you want them even without the float property.)

Share this post


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.

Guest
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.

Loading...
Sign in to follow this  

×
×
  • Create New...