[ Moderator Note: Please post code or markup snippets between backticks or use the code button. ]
Hi
Site: http://www.kit-center.com/
Ive used the Twenty Eleven (child) theme to do this site, but find that when I view the site on an ipad, the top banner takes up the full width of the screen, but the rest of the site only takes up about 2 thirds of the screen width.
I added this code to the bottom of my style sheet to try and resolve the problem, but it's still the same.
/* =Responsive Structure for narrow screens
* to keep min width and sidebar
-------------------------------------------- */
@media (max-width: 800px) {
#page {
min-width: 500px;
}
/* keep the sidebar - for right sidebar */
.right-sidebar #main #content {
margin: 0 29% 0 1%;
width: 70%;
}
.right-sidebar #main #secondary {
float: right;
margin: 0 1% 0 1%;
width: 24%;
}
/* keep the sidebar - for left sidebar */
.left-sidebar #main #content {
margin: 0 1% 0 29%;
width: 70%;
}
.left-sidebar #main #secondary {
float: right;
margin: 0 -1% 0 2%;
width: 24%;
}
/* correction for 'showcase' template */
.page-template-showcase-php #main #primary.showcase {
float: right;
margin: 0 2% 0 2%;
width: 96%;
}
.page-template-showcase-php #main #primary.showcase #content {
margin: 0 6% 0 6%;
width: 88%;
}
.page-template-showcase-php section.recent-posts {
float: right;
margin-right: 0pt;
margin-left: 31%;
width: 69%;
}
.page-template-showcase-php #main .widget-area {
float: left;
margin-right: -22.15%;
margin-left: 0pt;
width: 22.15%;
}
/* correction for singular posts/pages without sidebar */
.singular #main #content {
margin: 0 8% 0 8%;
width: 84%;
}
}
Anyone have any suggestions that might help?
Thanks!