On Sun, Mar 27, 2016 at 06:48:09PM -0600, Stuart Henderson wrote:
> CVSROOT:      /cvs
> Module name:  www
> Changes by:   st...@cvs.openbsd.org   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

Reply via email to