Float element should has parent element that defined clear property. code example

Example 1: Float element should has parent element that defined clear property.

.clearfix::after { 
   content: " ";
   display: block; 
   height: 0; 
   clear: both;
}

Example 2: Float element should has parent element that defined clear property.

<div>
  <div style="float: left;">Div 1</div>
  <div style="float: left;">Div 2</div>
  <div class="spacer" style="clear: both;"></div>
</div>

Example 3: Float element should has parent element that defined clear property.

<div style="float: left;">
  <div style="float: left;">Div 1</div>
  <div style="float: left;">Div 2</div>
</div>

Example 4: Float element should has parent element that defined clear property.

<div style="overflow: auto;">
  <div style="float: left;">Div 1</div>
  <div style="float: left;">Div 2</div>
</div>

Example 5: Float element should has parent element that defined clear property.

<div style="height: 300px;">
  <div style="float: left;">Div 1</div>
  <div style="float: left;">Div 2</div>
</div>

Tags:

Misc Example