Responsive Problems

[ant1225]

Hello,

I am currently have trouble with the responsive layouts of your theme. I have taken
screenshots of the website on an iPad Mini and iPhone so you can see the problems that I am having.

On the iPad Mini, the menu seems to be on top of my logo. Is there anyway I can get a drop down mobile menu or some way to fix it?

On the iPhone my logo doesn’t seem to be centered. I believe this might be perhaps because my theme is outdated?

The website is mixteca.org

Thank you in advance.

[Raghavendra]

For the iPad issue, pls insert the following CSS into Custom CSS tab in the Theme Options panel or the /custom/custom.css file

@media only screen and (min-width: 768px) and (max-width: 959px) {

#header {  height: 170px; }

#primary-menu { left: 100px; }

}

[Raghavendra]

For the iPhone, you will need to change the values based on the actual width of your logo (100px) –

@media only screen and (max-width: 768px) {

#site-title a, #sticky-site-title a { min-width: 100px; }

#header-logo { width: 100px; }

}

[Raghavendra]

I do not think this is due to theme being outdated. It is mostly because the requirements of each site is a little different (logo size, menu contents etc.) which requires us to tweak the css a little bit to make it look a little perfect.

[Author]

Posts