Layouts

HTML Layout Example

---

HTML Layout Elements

Websites often display content in multiple columns (like a magazine or newspaper).
HTML5 offers new semantic elements that define the different parts of a web page:

<header> - Defines a header for a document or a section <nav> - Defines a container for navigation links <section> - Defines a section in a document <article> - Defines an independent self-contained article <aside> - Defines content aside from the content (like a sidebar) <footer> - Defines a footer for a document or a section <details> - Defines additional details <summary> - Defines a heading for the <details> element

---

HTML Layout Techniques

There are four different ways to create multicolumn layouts. Each way has its pros and cons:

• HTML tables
• CSS float property
• CSS framework
• CSS flexbox