Layout mode

Layout mode

A CSS layout mode, sometimes abbreviated as layout, is an algorithm determining the position and the size of boxes based on the way they interact with their sibling and ancestor boxes. There are several of them:

  • The block layout, designed for laying out documents. The block layout contains document-centric features, like the ability to float elements or to lay them out over multiple columns.
  • The inline layout, designed for laying out text.
  • The table layout, designed for laying out tables.
  • The positioned layout, designed for positioning elements without much interaction with other elements.
  • The flexible box layout, designed for laying out complex pages that can be resized smoothly.
  • The grid layout, designed for laying out elements relative to a fixed grid.

Note: Not all CSS properties apply to all layout modes- Most of them apply to one or two of them and have no effect if they are set on an element participating in another layout mode-

See also

© 2005–2017 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/Layout_mode

在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号

意见反馈
返回顶部