Darkness Posted May 18, 2009 Share Posted May 18, 2009 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! Link to comment Share on other sites More sharing options...
cedric Posted May 18, 2009 Share Posted May 18, 2009 put this between the two blocks.<div style='clear: both'> </div>this is to stop the floating after the first div. Link to comment Share on other sites More sharing options...
Darkness Posted May 18, 2009 Author Share Posted May 18, 2009 Thank you. 8D Link to comment Share on other sites More sharing options...
jeffman Posted May 18, 2009 Share Posted May 18, 2009 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.) Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.