themes - Mobile issue – website isn't properly detecting screen size

admin管理员组

文章数量:1415064

Closed. This question is off-topic. It is not currently accepting answers.

---

Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.

Closed 5 years ago.

Improve this question

my question concerns this website (currently on my staging server):

The theme is a child theme of a parent theme I created with Underscores and Bootstrap. I am getting some odd behavior when I view the website on my phone. See the screenshot below.

If I click another page in the menu, the website corrects itself and fits properly on the screen. However when I turn my phone to landscape, the full-size desktop version loads. Again, when I click another page in the menu, the website resizes itself to properly fit the screen.

Any idea what is causing this?

Closed. This question is off-topic. It is not currently accepting answers.

---

Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.

Closed 5 years ago.

Improve this question

my question concerns this website (currently on my staging server): https://sunstonebookkeeping.markhannondesign

The theme is a child theme of a parent theme I created with Underscores and Bootstrap. I am getting some odd behavior when I view the website on my phone. See the screenshot below.

If I click another page in the menu, the website corrects itself and fits properly on the screen. However when I turn my phone to landscape, the full-size desktop version loads. Again, when I click another page in the menu, the website resizes itself to properly fit the screen.

Any idea what is causing this?

• themes
• child-theme
• mobile
• responsive

Share Improve this question asked Aug 20, 2019 at 15:32 figure2figure2 1322 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

Your primary menu container is set to left: 5000px; witch stretches the width of the page. You can find this style directive in ...themes/sunstone-bookkeeping/css/mobile.css on line 66.

@media screen and (max-width: 600px)
.nav-menu {
    position: absolute;
    left: 5000px;
}

One way to fix this is to add the following styles to the parent element:

.menu-menu-1-container {
    position: relative;
    overflow-x: hidden;
}

This solution shouldn't mess with other styles.

The proper way of applying this kind of changes is described here: child themes. In the style.css file of your child theme you can safely add the solution that I proposed. Cheers!

本文标签： themesMobile issue – website isn39t properly detecting screen size