On Sun, Mar 27, 2016 at 06:48:09PM -0600, Stuart Henderson wrote:
> CVSROOT: /cvs
> Module name: www
> Changes by: [email protected] 2016/03/27 18:48:09
>
> Modified files:
> . : openbsd.css
>
> Log message:
> Raise max-width. Still pixel-based as %-based steals too many pixels on
> small screens.
>
> Does anyone have suggestions on how to set e.g. 80% max-width while
> protecting against small windows going too narrow without forcing
> scrolling on mobile devices?
>
If I understand correctly, you want 80% max-width, except when the
viewport is too small. This can be done with CSS media queries. [0] e.g.
for the case at hand something like this might work (replace 800px with
whatever value you want):
Index: openbsd.css
===================================================================
RCS file: /cvs/www/openbsd.css,v
retrieving revision 1.3
diff -u -p -r1.3 openbsd.css
--- openbsd.css 28 Mar 2016 00:48:09 -0000 1.3
+++ openbsd.css 28 Mar 2016 07:51:35 -0000
@@ -1,6 +1,5 @@
body {
margin: 40px auto;
- max-width: 1100px;
line-height: 1.6;
color: #111;
padding: 0 10px;
@@ -8,4 +7,10 @@ body {
h1,h2,h3 {
line-height: 1.2;
+}
+
+@media (min-width: 800px) {
+ body {
+ max-width: 80%;
+ }
}
natano
[0]
https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries
