Hello,

I would like to position 5 images in a table-like format.

What would be an ideal way to do this with CSS? I can do this easily with a data table, but would prefer to use CSS.

Comments

  1. Cady
    0

    Cady 90 days ago Permalink

    HI,
    If the data is tabular then use a table as that's what they are designed for ans is the semantic element to use.
    If the data is not tabular then for IE8+ you could do this:
    Code:
    Untitled Document
    h1 { text-align:center }
    .wrap {
    width:80%;
    margin:auto;
    border:1px solid #000;
    }
    .row {
    display:table;
    width:60%;
    margin:auto;
    border:1px solid #000
    }
    .box {
    display:table-cell;
    border-right:1px solid #000;
    padding:5px;
    width:33%;
    }
    .row2 { border-top:none; }
    .row2 .box { width:33% }
    .top { border-bottom:1px solid #000 }
    .last { border:none }
    IE8+
    Row 1 Cell a
    Row 1 Cell b
    Row 1 Cell c
    Row 2 Cell a
    Row 2 Cell b
    It all depends on the exact dynamics you want as you could float instead if you didn't need equal heights.