locked
5 Pictures in a div RRS feed

  • Question

  • I have 5 images of the same size 100 x 100 in a div (that is plenty wide).  What is the best way to get them perfectly aligned side by side and centered in the div?

    What if the pictures were size differently, how would that change things?


    Tony
    Saturday, April 2, 2011 1:27 PM

All replies

  • You can centre them by setting the text-align style of the div to 'center'. Spacing them can be achievd by setting the margin for images in the div. So if your div has an ID of 'pics', for example,

    #pics {
    text-align:center;
    }

    #pics img {
    margin:10px;
    }

    This will give 20px spacing between each image (2 x 10px, left and right margins)

    If the images are different sizes you could adjust the margins individually. Easy to do by dragging the margin handles in Design or Spli views.

    HTH


    Ian Haynes

    EW V4 Add-Ins
    EW resources, hints and tips
    Saturday, April 2, 2011 4:06 PM