CSS layout samples

• Two Columns Layout

  • via float
  • via negative margin
  • via flexbox

• Three Columns Layout

  • via negative margin
  • via flexbox

• CSS Center Layout

  • Text
    • Single Line
    • Multiple Lines
  • Block
    • Inline Block
    • Block

• float： IE6+, Firefox 2+, Chrome 1+ etc;
• negative margin: IE6+, Firefox 2+, Chrome 1+ etc;
• flex： Till 2017-3-28:

• Two columns in PC-side —— float;
• Three columns in PC-side —— margin;
• Mobile application —— flex。