some CSS fixes for mobile sites with text titles

This commit is contained in:
Jeff Atwood 2015-01-01 00:54:53 -08:00
parent 35edfb5b91
commit 911f941da5
3 changed files with 14 additions and 14 deletions

View File

@ -17,7 +17,7 @@
.title { .title {
display: table; display: table;
float: left; float: left;
height: 40px; height: 45px;
> a { > a {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;

View File

@ -106,14 +106,9 @@ blockquote {
width: 90%; width: 90%;
} }
// if the logo is text, it can't be too big or small width devices have issues // somehow the image logo assumption inherits margins from earlier in the CSS stack
// we must remove margins for text site titles
h2#site-text-logo h2#site-text-logo
{ {
max-width: 135px; margin: 0;
max-height: 1em;
overflow: hidden;
padding: 0;
margin: 5px 0 0 0;
text-overflow: clip;
white-space: nowrap;
} }

View File

@ -3,15 +3,19 @@
// -------------------------------------------------- // --------------------------------------------------
.d-header { .d-header {
padding-left: 10px !important;
padding-right: 10px !important;
#site-logo { #site-logo {
max-width: 122px; max-width: 122px;
} }
.panel { // some protection for text-only site titles
margin-right: 20px; .title {
margin-left: 20px;
max-width: 135px;
overflow: hidden;
padding: 0;
text-overflow: clip;
display: block; // table causes clipping fail oddities here
} }
.icons { .icons {
@ -28,6 +32,7 @@
display:none; display:none;
} }
} }
#main-outlet { #main-outlet {
padding-top: 60px; padding-top: 60px;
} }