Hi,
I am using the Choices theme and I am having difficulty displaying the menu and slider correctly on the vertical tablet. Mobile devices and landscape tablet are fine. But vertical tablet the menu wraps to two lines, and the first item overlays the logo, and the last item is over the slider. Also, slider text is cutt off. And the small header info overlays part of the logo.
The dev. site can be found here: http://www.stlouisunionroofing.com/wp/
How do you suggest to correctly display the menu and slider on the vertical tablet? Should I use mobile size display settings? If so, how?
I have made some minor customizations to the theme's quick CSS. Related changes are shown below:
--------------------------------------------------------------
#header .container {
min-height: 140px;
z-index: 100;
overflow: visible;
background: none;
}
.main_menu {
float: right;
clear: both;
position: relative;
z-index: 100;
padding: 0;
line-height: 30px;
height: 15px;
margin: 23px -30px;
}
div .logo {
padding: 10px 0 0px 0;
min-height: 100px;
}
.logo, .logo a {
float: left;
padding: 0;
position: relative;
margin-bottom: -19px;
display: block;
}
.social_bookmarks{display:none}
.header_meta{text-align:right;margin-top:-30px;width:auto;;}
.small_header_info{display:inline;margin-right:20px;bottom:0;top:5px;position:relative;}
/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
.responsive .header_meta{height:auto;margin-top:-10px;width:auto;text-align:center;}
.small_header_info{display:block;}
}
#searchform {
display: none;
}
--------------------------------------------------------------------------------
Please let me know what you suggest.
Thanks,
Alex














