Why is min-width 25em used in media query for gel-layout
Closed this issue · 2 comments
dagda1 commented
Why is min-width 25em used in the following media query:
@media (min-width: 25em) {
.gel-wrap {
padding-left: 16px;
padding-right: 16px;
}
}
As this is the smallest breakpoint, it will be applied to everything or am I missing something?
The docs ay 8px is used for padding on smaller devices but I don't see this as true.
shaunbent commented
25em translates to 400px, which is the second breakpoint of the 5 breakpoints the guideline defines. http://www.bbc.co.uk/gel/guidelines/grid#grid-sizes
By default all margins are 8px for smaller devices and at 400px this increases to 16px, hence that media query.
dagda1 commented
Great, thank you for the quick answer.