Minimum Mobile Responsive? Not if you use images…

[provirtualassistant]

My website http://www.yourqualifier.com has been designed to be just as the theme I chose to use - mimimal. The home page is a static page with no sidebar. But making this look good on any mobile device is nuts!

How do I change the mobile responsiveness of this theme so that it looks the same on my desktop AND on a mobile device? I have been using http://responsive.pixeltuner.de/ to test it and it's driving me nuts! 🙁

Thank you in advance for your help!

Suzanne

http://www.yourqualifier.com

[David Chu]

Hi,
Oh my! This really has nothing to do with images. You've got HTML tables in there. Tables are a CSS nightmare for responsiveness, and are generally best avoided. Many modern theme coders don't even write CSS for them.

I do have something that will unscrew it a little. If you add this to your style.css, it will make the table flex somewhat at smaller sizes.

table {
  max-width: 100%;
}

But to get everything to look pretty with tables at small device sizes, lots more CSS changes probably needed. Geek most likely required.

A much better way is to just add your images to your page content one-at-a-time, and then align them left. No tables involved. And some CSS spacing may be needed.

You will save yourself many headaches by avoiding tables like the plague. Even I will concede that sometimes tables are still useful for tabular data. But fairly advanced CSS skills are needed to handle them.

Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[Marc]

Have you explored using Genesis' built in Content Column Classes rather than tables?

I think it would resolve the issues with mobile responsiveness while giving you most of the control and display options of a table.

If you haven't, below are link providing additional info and use options for column classes.

http://my.studiopress.com/tutorials/content-column-classes/

Using Column Classes

http://wordpress.org/plugins/genesis-easy-columns/

---

Resultz Digital | Websites, search marketing services and consulting for small business.

[David Chu]

Marc's point is very good. And your theme does contain column classes. So if you're willing to do a touch of HTML editing, or willing to try the plugin to get around that, that would be a very good alternative.

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[provirtualassistant]

Thank you VERY much! I've removed the tables and its completely responsive now. Thankful the answer was that simple!

Thanks again!

Suzanne

[David Chu]

Great!
Glad it helped.

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[Author]

Posts