Bottomaligned

Bottomaligned, or bottom-aligned, refers to the arrangement of objects so that their bottom edges share a common horizontal line. It is a basic alignment mode used to create visual stability and predictability in layouts. The term appears across typography, graphic design, user interface design, and data visualization, and is often considered alongside top-aligned and center-aligned arrangements.

In typography and typesetting, bottom alignment can apply when coordinating text elements with differing shapes or sizes. Designers may align the lowest parts of glyphs along a bottom line or use baseline grids to keep descenders and other features visually consistent within a block of text or captions. This helps prevent trailing differences from drawing attention away from the content.

In user interfaces and web design, bottom alignment commonly anchors controls, captions, and decorative elements to the bottom edge of a container or viewport. In CSS, vertical alignment can be expressed with inline elements via vertical-align: bottom, or with layout models such as Flexbox and Grid by aligning items to the end or bottom of the cross axis.

In data visualization and graphic design, bottom alignment ensures that bars, labels, or annotations rest on a shared baseline, facilitating straightforward comparison and legibility. It is often used for axis labels, legends, and bottom-oriented captions.

See also: alignment, baseline, vertical alignment, typography.