Minimum Mobile Responsive? Not if you use images…

Community Forums Forums Design Tips and Tricks Minimum Mobile Responsive? Not if you use images…

This topic is: not resolved

This topic contains 5 replies, has 3 voices, and was last updated by  David Chu 1 year ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #55143

    provirtualassistant
    Participant
    Post count: 4

    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
    #55238

    David Chu
    Participant
    Post count: 1355

    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.

    [css]
    table {
    max-width: 100%;
    }
    [/css]

    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

    #55429

    Marc
    Moderator
    Post count: 197

    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/

    http://www.billerickson.net/using-column-classes/

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


    #55430

    David Chu
    Participant
    Post count: 1355

    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

    #55616

    provirtualassistant
    Participant
    Post count: 4

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

    Thanks again!

    Suzanne

    #55664

    David Chu
    Participant
    Post count: 1355

    Great!
    Glad it helped.


    Dave Chu · Custom WordPress Developer – likes collaborating with Designers

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.