CSS Notes - Page 9

Writing Markup That CSS Can Lay Out

Grid and flexbox changed what markup a layout needs. Fewer wrappers, source order that matches reading order, and the reorder trap that breaks keyboar...

HTML

CSS Selectors Your Markup Makes Possible

The structure you write decides which selectors are available. Attribute selectors, sibling combinators and structural pseudo classes can replace a su...

HTML

The class and id Attributes

Two ways to name an element, with different rules and different jobs. Choosing correctly makes a stylesheet maintainable and stops the specificity war...

HTML

Three Ways to Attach CSS, and When Each Is Right

External, internal and inline styles. One of them is the answer almost always, and knowing why the other two exist is what tells you when to break the...

HTML

div and span: When Nothing Else Fits

Two elements with no meaning at all, and that is the point. Learn what they are for, why they are not a failure, and how to know you have too many.

HTML

Responsive Tables on Small Screens

A table with eight columns cannot fit on a phone. Four patterns that keep the data usable, and the trade off each one makes.

HTML

Block Level and Inline Elements

The oldest distinction in HTML layout: block boxes stack down the page and fill the width, inline boxes sit inside a line of text. It also decides whi...