Tachyons

Docs

/

Themes

/

Background Size

Version
<%= moduleVersion %>
Filesize
<%= moduleSize %>
Declarations
<%= moduleObj.declarations.total %>
Selectors
<%= moduleObj.selectors.total %>
Max. Specificity Score
<%= moduleObj.selectors.specificity.max %>
Size of Avg. Rule
<%= moduleObj.rules.size.average %>

Background-size affects how images fill their containing elements. While units can be declared explicitly to size an image, the ones that seem most reusable are setting contain or cover.

Examples

Contain

Contain will make sure that the entire image is displayed within the element, regardless of the elements dimensions.

Cover

Cover will make sure the entire element is covered - but won't guarantee that the entire image will be shown.

Previous

Hovers

Next

Borders
src/_background-size.css

<%= srcCSS  %>

<%= navDocs %>
<%= siteFooter %>