• UseCSSForSpacing

UseCSSForSpacing

Since mobile devices typically have small displays of varying dimensions, it may be best to avoid specifying spacing altogether, and prefer to let the device determine appropriate spacing. When necessary though, use CSS for spacing, not graphics. Often, content authors try to exert fine-grained control over element spacing on a page by adding invisible single-pixel images with particular pixel dimensions that create the desired spacing on a desktop browser. This is undesirable as it often creates an extra image request to the server. It also often requires one to specify spacing in absolute measures (pixels), which is also against best practices.

Bad:

<p><img src="tiny.gif" width="2" height="1"/>Foo</p>

Good:

<p style="padding-left: 10%">Foo</p>

Back to BestPracticesList

CategoryPhp CategoryXhtml CategoryBpGraphicsForSpacing CategoryBpMeasures