More page layout adjustments for mobile browsers and small windows

master
Simon McVittie 2014-12-01 14:56:04 +00:00
parent ceab72ad34
commit 94afbc2fa6
4 changed files with 20 additions and 0 deletions

View File

@ -555,6 +555,7 @@ a.openid_large_btn:focus {
width: auto;
float: none;
margin-top: 0;
border: none;
}
/* if the mobile browser is new enough, use flex layout to shuffle
@ -578,4 +579,8 @@ a.openid_large_btn:focus {
-webkit-order: 1;
order: 1;
}
.blogform, #blogform {
padding: 4px 4px;
}
}

View File

@ -147,3 +147,13 @@ div.recentchanges {
/* allow space for the action tabs */
margin-bottom: 2em;
}
@media (max-width: 600px) {
#content, #enclosure, #comments, #footer {
margin: 0.5em;
}
.pageheader .actions ul li {
padding: .1em .2em 0 .2em;
font-size: 0.8em;
}
}

View File

@ -291,6 +291,10 @@ body {
#pagebody {
margin: auto;
border: none;
padding: 0.5em;
}
#footer {
padding: 0.5em;
}
}

View File

@ -10,6 +10,7 @@ body {
margin-left: auto;
margin-right: auto;
width: 48em;
max-width: 95%;
background: url(gradient.png) repeat-x white 0px -16px;
margin-top: 48px; /* height of gradient.png that we want to see */