Make aside element more elegant on mobile

4 years ago · b802ddfc01
parent 6f6db2fa60
commit b802ddfc01
1 changed files with 14 additions and 8 deletions
--- a/posts/use-your-mail-client-for-physical-mail/index.html
+++ b/posts/use-your-mail-client-for-physical-mail/index.html
@ -25,10 +25,24 @@
         margin: auto;
     }

+     aside {
+         width: 30%;
+         min-width: 10em;
+         background-color: rgba(0,0,0, 0.1);
+         float: right;
+         padding: 1em;
+         margin: 1em;
+     }
+
+
     @media only all and (pointer: coarse), (pointer: none) {
         body {
             font-size: 5.5vmin;
         }
+
+         aside {
+             width: inherit;
+         }
     }

     @media only all and (pointer: fine) {
@ -39,14 +53,6 @@
         }
     }

-     aside {
-         width: 30%;
-         min-width: 10em;
-         background-color: rgba(0,0,0, 0.1);
-         float: right;
-         padding: 1em;
-         margin: 1em;
-     }
    </style>

    <body>