Bulletproof Web Design: Improving flexibility and protecting against worst-case scenarios with HTML5 and CSS3, Third Edition

3. Expandable Rows

Resist specifying height and plan for vertical expansion of horizontal page components

Horizontal page components such as site headers, login bars, breadcrumb trails, and search bars are no strangers to a typical website. These areas are often positioned near the top of the page and may contain a mixture of graphics (whether a background or otherwise) and text. In general, these areas are designed in such a way that prohibits vertical expansion—assuming that a larger text size or an increased amount of content would either never happen or wouldn’t harm the design. While it’s customary for areas that contain articles or long sections of text to accommodate any length or size of text and content, it’s important—and not impossible—to ...