Where Is The Mistake?

When I test my site with a responsive tester, I notice there is a horizontal slider beneath for 240 size. Is something at fault with my media query?

 

How are we supposed to know - you're not providing any code... at all. However, generally speaking, it can be many things - for instance something that is wider than the visible content - depends on what is being reassigned inside the media-query. Without a page-link, or code, we can't really do much...

 

Site: http://bestlifequotesblog.com/

This is the customized code which you did for me before:

#main {
padding: 10px;
}
.main-wrap {
float: left;
margin-left: 1rem;
margin-right: 21rem;
}
#sidebar-primary-wrap {
float: left;
margin-left: 1rem;
margin-right: -21rem;
width: 20rem;
}

#sidebar-secondary-wrap {
float: left;
margin-right: -20rem;
position: relative;
width: 20rem;
}

This is my my media query:
@media (max-width: 320px) {
.main-wrap {
float: none;
width: auto;
}
}

 

Hm - did you do something? Because now it works as intended...?

 

No. From me over here, when I test it with http://mattkersley.com/responsive/, there is a slider at the bottom for 240x 320 size.

 

Ah - I checked it in Chrome (without Adblock) and yep, there it is - it's the ads on the page - either you have to hide them for 240px devices, or change the ads to text-ads or something else.

 

Would you mind share with me as how to hide ads as you suggested? Another thing is how to have the sidebars having the same width as the content?

 

Really, dude, you need to do some of this yourself Find whatever container the ads have, and set that class or id or whatever container they're in to display: none; within the @media-rule

 

Again, endless pointless DIV for NOTHING, endless pointless classes for NOTHING, static scripting in the markup, little if anything resembling logical document structure, massively painful select that I'd sooner eat a bullet than put on a website, and the typical train wreck disaster one can expect from the steaming pile of manure known as turdpress...

The question is not "where's the mistake?": the question is "what part of it ISN'T a mistake?"

 

Alright. Thank you. By the way, when I use the site URL (homepage), the responsive test results are fine. The problems are only with single posts and pages.

 

I have just tested it out with this tool: http://responsivetest.net/, there is no problem, except the width of both sidebars.

 

If so, I would suggest finding the @media-rules again, and set the width of the sidebar-classes to the same as the main-container within them - that should in theory fix the issues with sidebars.

 

When you say main-container, which one is that? From the style CSS file there are two of them:
#container {
max-width: 95%
and
#container {
background: #fff;
width: 1200px;
margin: 2rem auto;
padding: 0

 

Anyway, thank you all. All my issues have been fixed and it is working fine now. No more mistakes.