WordPress.org

1. stonefree
   Member
   Posted 1 year ago #

   I consider myself pretty fluent with CSS but something I'm trying to do with clear is baffling me. I took the code below from a tutorial site. It's 2 divs floated left. The first one has "clear:right". My understanding of clear is (from W3Schools) "The clear property specifies which sides of an element where other floating elements are not allowed." Should "clear:right" push div2 down below div1?

   <style type="text/css">
   div.clear {
     border:1px solid #ff9900;
     width:120px;
     float:left;
     clear:right;
     }
   div.float {
     border:1px solid #cccccc;
     width:120px;
     float: left;
     }
   </style>
   <div class="clear">Div1 with float:left and clear:right</div>
   <div class="float"><p>Div2 with float:left </div>

2. esmi
   Theme Diva & Forum Moderator
   Posted 1 year ago #

   Should "clear:right" push div2 down below div1?

   No. But there are other factors that could come into play. For example the unclosed <p> tag in your second div. The total width you have in which these two blocks can float. what you have in the rest of the page & the stylesheet.

   It's really not possible to troubleshoot CSS issues without seeing the issue in the context of the whole page.

Topic Closed

This topic has been closed to new replies.