Web Analytics Made Easy -
StatCounter How can I center an unknown amount of images accross the page? - CodingForum


No announcement yet.

How can I center an unknown amount of images accross the page?

  • Filter
  • Time
  • Show
Clear All
new posts

  • How can I center an unknown amount of images accross the page?

    I would like to center my images accross the page. Currently, I am using a table to do this such as:

    <table width="100%">
      <td width="33%" align="center"><img src="image1.jpg"></td>
      <td width="34%" align="center"><img src="image2.jpg"></td>
      <td width="33%" align="center"><img src="image3.jpg"></td>
    This works great if you always have 3 images, however I am now going to have to use a random number from 1 to 10 images. I would like these images to be centered like the above example, but fitting as many images accross the page as possible before wrapping to a new line of images. The last row of images should be centered as well, not justified to the left.

    Is this possible with any combination of CSS or HTML tags, or am I going to have to create a PHP function to generate a table based on the number of images? (Basically, I want text-align:justify; to work on images).

  • #2
    Are the images going to be of different sizes? I think you are looking into this too much. Generate the images inside a single div and use text-align:center; thats it images all centered. You can even put some margin in between the images if you like.
    ||||If you are getting paid to do a job, don't ask for help on it!||||


    • #3
      Yes, all the images are the same size. The reason I am not using text-align:center; is that I need the images spaced accross the screen, not hudled together in the middle.

      edit: I realize I can add margins to the images, but the amount to add would depend on the number of images that fit accross the screen, and would change if the user resizes the browser window. That is why I was using a table with centered elements.
      Last edited by JoeTheZombie; Jul 30, 2005, 09:57 PM.