Clear float several ways, their advantages and disadvantages?

① parent element to define the height of the individual
  advantages: simple and rapid, less code.
  Cons: can not be responsive layout.

② At the end of the tag label CSA div <div style = "clear: both "> </ div>
  advantages: simple and rapid, less code, high compatibility.
  Disadvantages: increased empty label, is not conducive to on-page optimization.

③ parent definitions overflow: hidden
  advantages: simple and rapid, less code, high compatibility.
  Cons: the excess is hidden, in time to pay attention to the layout.

④ defined parent class = "clearfix", used after pseudo classes and Zoom
  .clearfix: after {Content: ""; the display: Block; Clear: both; height: 0; overflow: hidden; visibility: hidden;}
  .clearfix { zoom: 1;}
  advantages: fixed wording, no extra structure, high compatibility.
  Disadvantages: Code and more.

Guess you like

Origin www.cnblogs.com/wuqilang/p/11204666.html