scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-27 01:25:52 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Expand view to wrap contents on small screens

Browse source 
`inline-block` causes #view width to expand to its children's width.

`min-width: 100%` is necessary for larger screens, so that the `inline-block` element is still grows to contain all the available width.

The 1px of padding is apparently needed for Android Chrome, otherwise the right edge has blue from the body background showing.
This commit is contained in:
Ray Schamp 2015-10-26 12:06:41 -04:00
parent 73b3a91a05
commit f62618dadf
1 changed files with 4 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/main.scss
View file

@ -68,10 +68,12 @@ a:hover {
}
#view {
display: inline-block;
/* NOTE: Margin should match height in navigation.scss */
margin-top: 50px;
background-color: $background-color;
padding: 20px 0;
padding: 20px 1px;
min-width: 100%;
min-height: 768px;
}