Can Agency Home-Middle be more responsive?

[Liz]

I have 6 items in Home-Middle of my Agency (not pro) site. Can the responsiveness be tweaked so on smaller screens, they will narrow from 3 columns to 2 columns, and even smaller will go down to one column. Right now those 6 blocks move immediately to 1 column of 6 blocks, even when the screen is just slightly smaller.

http://www.passiongoddess.com/test/

[Susan]

I hope you were able to get your issue resolved. If not, please report back here, and I can escalate for you. Thanks!

[Liz]

Hi Susan,
I never did figure this out. My site is now live, and still has the same issue.

It is now at http://robinbachbodysense.com

[Tom]

Hey, Liz,

Please try this code for your media queries:

@media only screen and (max-width: 960px) {
    .featuredpage, .featuredpost {
        clear: right;
        float: left;
        width: 40%;
        padding-left: 5%;
        padding-right: 5%;
        margin:left: 0px;
        margin-right: 0px;
    }
}

@media only screen and (max-width: 350px) {   /* or whatever width suits */
    .featuredpage, .featuredpost {
        width: 100%;
        padding-left: 0%;
        padding-right: 0%;
        margin:left: 0px;
        margin-right: 0px;
    }
}

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[Liz]

Tom,
I tried the media queries you suggested and it all looked great on my desktop as I resized my browser down smaller and smaller. However on my actual mobile device the 6 square images on home page were cropped from the right, as they were fitting into 3 rows of 2, etc. I've commented out the code for now.

any other thoughts?

[Author]

Posts