Mobile Responsive Home Page Features

It’s because of the width: 1140px; that you added near line 1416 in your css –

.home-feature-bg-alt .featuredpage .page,
.home-feature-bg-alt .featuredpost .post {
    float: left;
    margin: 0;
    overflow: hidden;
    padding: 0 0 5px;
    width: 1140px;
}

You’ll need to add a new width or change it to 100% in your mobile responsive section so it will adjust to that width when viewed on mobile screens.

The suggestion above works fine….actually both suggestions work fine, you would need to add the second suggestion above in order to have it show up properly when viewed on a mobile device. When I added it, here was the result – http://i.imgur.com/fpRWlNy.png

All you would need to do is change the width to 100% instead of 1140px (in the responsive section of your css, not the main part) since that will be too wide for a small screen.

Example: add this code –

.home-feature-bg-alt .featuredpage .page,
.home-feature-bg-alt .featuredpost .post {
    width: 100%;	
}

….to your responsive section around line 4000 (under the 960px width area) which will look like this –

/* iPad/Tablets (portrait and landscape)
--------------------------------------------- */

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

That will be all you’d need to do to get everything looking like the screenshot I have above.

The reason we did all of this is because you needed a little bit of custom code to get everything setup properly since you wanted wide/full width featured posts and pages in those areas. Other users have only needed multiple posts to show in a single row, so that’s why we needed to add the above code as well as the code from the other forum thread. Does this all make sense?