Slate theme, mobile view aligned left
Permalink
Hi there,
Just wondering if anyone out there might be able to shed some light on the issue I'm having with the mobile rendering of a site for a non-profit ski club.
Slate theme has no support any longer since 5.7.
When the site is viewed on a mobile phone, it aligns left and shrinks down and you can barely see the text. If you double tap the screen it will zoom to a full screen but that is not ideal.
The home page seems to be fine, but any page visited after squishes over to the left and the screen just shows the blue background with social media icons on top.
I have not edited the mobile.css at all and other sites I have used Slate on do not have this issue. This version is running 5.6.3.1
The site with issues is apexfreestyleclub.com
Any help is greatly, greatly appreciated.
Thank you
Just wondering if anyone out there might be able to shed some light on the issue I'm having with the mobile rendering of a site for a non-profit ski club.
Slate theme has no support any longer since 5.7.
When the site is viewed on a mobile phone, it aligns left and shrinks down and you can barely see the text. If you double tap the screen it will zoom to a full screen but that is not ideal.
The home page seems to be fine, but any page visited after squishes over to the left and the screen just shows the blue background with social media icons on top.
I have not edited the mobile.css at all and other sites I have used Slate on do not have this issue. This version is running 5.6.3.1
The site with issues is apexfreestyleclub.com
Any help is greatly, greatly appreciated.
Thank you
The problem is in your header-area, there is a table with style="width: 999px; height: 161px;" which forces the page wider than the viewport.
Hi Hutman,
Thank you for looking at this for me. I can't seem to find this table?
This is the only css associated with the header-area:
#header-area {
float:right;
text-align:right;
width:100%;
}
#header-area p {
margin:0;
}
#header-area input[type="text"] {
display:inline!important;
Thanks again.
Thank you for looking at this for me. I can't seem to find this table?
This is the only css associated with the header-area:
#header-area {
float:right;
text-align:right;
width:100%;
}
#header-area p {
margin:0;
}
#header-area input[type="text"] {
display:inline!important;
Thanks again.
It is on the HTML of the table, so probably in an HTML or Content block somewhere, it's not in a CSS file in the theme.
I found it. It was inline in a content block in a stack.
Thank you for your help. I appreciate it!
Cheers
Thank you for your help. I appreciate it!
Cheers
