Change responsive method. Probably breaks most old browsers
This commit is contained in:
		
							parent
							
								
									4e9df4568a
								
							
						
					
					
						commit
						10319489f0
					
				|  | @ -2,9 +2,19 @@ | |||
| 
 | ||||
| :root { | ||||
|   --site-width: 960px; | ||||
|   --site-padding: 10px; | ||||
| 
 | ||||
|   --content-width: calc(var(--site-width) - var(--site-padding) * 2); | ||||
| 
 | ||||
|   --regular-margin: 15px; | ||||
| } | ||||
| 
 | ||||
| @media only screen and (max-device-width: 960px) { | ||||
|   :root { | ||||
|     --site-width: 100vw; | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| html, body, p, h1, h2, h3, h4, h5, h6 { | ||||
|   margin: 0; | ||||
|   padding: 0; | ||||
|  | @ -97,7 +107,7 @@ header hr, footer hr { | |||
| } | ||||
| 
 | ||||
| main img { | ||||
|   max-width: var(--site-width); | ||||
|   max-width: var(--content-width); | ||||
|   box-sizing: border-box; | ||||
|   border-radius: 5px; | ||||
|   box-shadow: 2px 2px 10px #000; | ||||
|  | @ -110,13 +120,3 @@ time, small { | |||
| footer small a { | ||||
|   padding-right: 12px; | ||||
| } | ||||
| 
 | ||||
| @media only screen and (max-device-width: var(--site-width)) { | ||||
|   body { | ||||
|     max-width: 100vw; | ||||
|   } | ||||
| 
 | ||||
|   main img { | ||||
|     max-width: 95vw; | ||||
|   } | ||||
| } | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue