Support » Themes and Templates » css tables with float:left and wp-mobile

  • If I am posting an already answered question I apologize in advance. My search didn’t turn up any relevant answers.

    I am trying to add some css tables to my front page to allow four “blocks” of text to be grouped together in a row of four columns like so:
    one 888 x 0 pixel transparent image to keep these "blocks" aligned on the same level horizontally
    <div style="float:left; width:205px; background:url(/images/tab_document.png) no-repeat transparent;background-position: 0 0;padding: 0 2% 0;">
    <h2 style="margin: 0 0 14px 11%;font-size: 14px;line-height:14px;padding: 0;">Section title</h2>
    <hr size="1px" />
    <strong>Intro</strong>
    Info paragraph goes here
    </div>

    This works exceptionally well except with the wptouch mobile theme plugin. With four of these “blocks” they jumble the wptouch mobile theme’s footer so the “mobile theme on/off” is mixed in with the blocks of text.

    Taking out the float:left element fixes that problem, however in the desktop browser they’re no longer side by side but in one large column. I’ve been messing around with the php and css for a few days and it looks like premature balding might start happening if I can’t figure this out. I’ve tried wp-tables or other tables programs but they just seem to scrunch the text up real close like sardines. Does anyone out there have suggestions that would help?

  • The topic ‘css tables with float:left and wp-mobile’ is closed to new replies.