hopefully fix ios aspect ratio
This commit is contained in:
parent
b9601ad2af
commit
4e86078310
1 changed files with 8 additions and 6 deletions
14
index.html
14
index.html
|
@ -26,18 +26,20 @@ h2 {font-size: 1.5em; line-height: 1.333}
|
|||
p {font-size: 1em; line-height: 1.5}
|
||||
/* layout */
|
||||
body {margin: auto; min-height: 100vh}
|
||||
@media (min-width: 40em) {
|
||||
body {margin: 0; width: 20em}
|
||||
header h1 {font-size: 1.5em}
|
||||
header p {font-size: 1em}
|
||||
}
|
||||
header {
|
||||
background: url(./images/sunset-bg-blue.jpg);
|
||||
background-size: contain;
|
||||
width: 100%; aspect-ratio: 1;
|
||||
background-repeat: no-repeat;
|
||||
width: 100vw; height: 100vw;
|
||||
padding: 1em;
|
||||
display: grid; grid-template-rows: 1fr auto auto
|
||||
}
|
||||
@media (min-width: 40em) {
|
||||
body {margin: 0; width: 20em}
|
||||
header {width: 20em; height: 20em;}
|
||||
header h1 {font-size: 1.5em}
|
||||
header p {font-size: 1em}
|
||||
}
|
||||
header h1 {grid-row: 2}
|
||||
header p {grid-row: 3}
|
||||
section {padding: 1rem}
|
||||
|
|
Loading…
Reference in a new issue