CSS Layout

HTML & CSS - Jon Duckett

• Chapter 15: Layout

  • Building blocks

    • Block-level boxes start on a new line and act as the main building blocks of any layout

      • Examples: < h1 >, < p >, < ul >, < li >

    • Inline boxes flow between surrounding text

      • Examples: < img >, < b >, < i >

  • Containing elements

    • If one block-level element sits inside another block-level element then the outer box is knon as the containing or parent element

  • The float property moves conent to the left or right of the page and can be used to create multi-column layouts

  • Pages can be fixed width or liquid (stretchy) layouts

  • Grids help make pages look professional and flexible

  • CSS frameworks provide rules for common tasks

    • Create layout grids, styling forms, creating printer-friendly versions of each page, etc

Information taken from “HTML & CSS Design and Build Websites” by Jon Duckett