Build on Minimum Pro – why not Home looking good on Iphone?

[computerkitten]

I built the website on Minimum Pro and its not looking good on the Iphone. I assumed out-of-the-box it would look good on the Iphone for the Home page with this theme. Otherwise I am really happy with it.

The website is here: http://tinyurl.com/k29f2eq

The 4 columns on this 4 page are not stacking right on top of each other when viewing on the Iphone. Example, images on the Home page for the Featured Blog post and Featured Page are too big. If I reduce the image in the @media 320 section then it reduces the images on all devices. Possibly of course the CSS is wrong. But not sure why it would be affecting all sections if I have it in the @media 320 section.
I can though, if I want, shrink the font down fine just for the @media 320 size.

But on the flip side shouldn't this automatically be included in the CSS for the Iphone, or at least shouldn't these featured images automatically be responsive (and shrink already according the device sizes?)

Advice?

Thank you!

[David Chu]

Hi,
You mean the goodies in the Home Featured thing, right? I see someone has accounted for that in the code, but they do look kind of squished. In the following bit of code in your stylesheet (Appearance.... Edit), if it were me I would change the 50% to 100%, and that would give them some air. 🙂

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

.home-featured-1,
.home-featured-2,
.home-featured-3,
.home-featured-4 {
width: 50%;
}

}

Cheers, Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[computerkitten]

So I'm finally getting back to this and appreciate you writing. I will try this change out and see how it looks on the Home page because yes the featured images are way too big and things are not looking good for the 320px width or 480px width. Let you know!

Thanks!

[computerkitten]

Okay I did update that to 100% and that did make it look better... what doesn't look very good still is that the Featured images are quite big for a 320px width or up to 768px width. How do you reduce the images for Home Featured areas only just for those mobile/tablet sections?

Thanks!

[David Chu]

Hands-on CSS coder probably needed for that, I'm afraid. It would be code that would be fairly similar to what's above, but just addressing those other items.

Cheers, Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[computerkitten]

Okay I think I will just create new sizes for the Featured images so its smaller across everything. That should take care of the look for all sizes. Thank you!

[Author]

Posts