3 columns of text

  • I have the tree columns in a table right now, but I need the test columns to fall below each other when in a mobile browser or when the shrink the regular browser

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hey,

    what you probably want to do is use <div> tags around the content, put 3 in a row and style them using CSS.

    You can then target the div’s using CSS.

    Try not to use tables unless completely and utterly necessary, as they dont work very well on mobiles

    Thread Starter helixpoint

    (@helixpoint)

    I tried this, but it does not wotk

    <div style=”width: 100%; overflow: hidden;”>
    <div style=”width: 400px; float: left; vertical-align: top;”>
    </div>
    <div style=”margin-left: 400px;”></div>
    </div>

    Ok, what you need to do is give the div’s an id (something like “my-column-1” “my-column-2” etc.

    Then target those id’s with specific CSS. If they are all to be the same width etc, you could use a class instead of an id, then just add one bit of CSS. That would look something like this:

    #my-column-1 {
    width: 30%;
    display: inline-block;
    text-align: center;
    }

    You could then change the CSS for mobile views etc, take a look at media queries also for that.

    As you have not posted a link its very difficult to see what you mean and what you want to so

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘3 columns of text’ is closed to new replies.