WordPress.org

Forums

How can I add 5 images to one line using css (2 posts)

  1. jmerr59944
    Member
    Posted 3 years ago #

    Hi,

    I am trying to have the 5 images seens on this page lie on the same line: http://getsapphiredesigns.com/test/

    I also need them spaced farther apart. When I added Divs and CSS rules they ended up on multiple lines.

    Please help,
    jeremy

  2. vtxyzzy
    Member
    Posted 3 years ago #

    Try arranging your divs like this:

    <div class="image-line">
       <div class="image-cell">
          <!-- put one image here -->
       </div>
       <div class="image-cell">
          <!--- put one image here -->
       </div>
       <!-- repeat for each image -->
    </div>
    <div class="image-clear"></div>

    Then, use CSS like this:

    .image-line {
       width: 600px;
    }
    .image-cell {
       width: 100px;
       margin: 10px;
       float: left;
    }
    .image-clear {
       clear: both;
    }

    Adjust the widths and margin as needed.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags