Horizontally align images

I’m trying to center the bottom logos on this page to look like [URL=“http://www.sineathconstruction.com/_source/ProposedPortfolio.png”]this. I’m not sure why it’s not working.

Also wondering best way to code the images on the portfolio page w/o using one whole image. I’d like to be able to click on each image and get a pop up with more info using jquery.


To center the footer, do this:

#footer_logo { 
  [COLOR="Red"]margin:20px auto 10px; [/COLOR]

For the portfolio images, set them all to float: left;

Thanks Ralph. I will try that…

How do I get the images on the page to line up like [URL=“http://www.sineathconstruction.com/_source/ProposedPortfolio.png”]the design? (One pic underneath the other one, etc?)

If the page will be static and stay the same for a while, the easiest way would be to wrap the three images down the left in a div and float it left; wrap the four top right images in a div and float that left; and wrap the three images to go at the bottom in a separate div and float that too.

Give each div an appropriate width.

Float it to the left too?

Do I keep the current div and then add these three divs within it?

That would be fine. Although I would just get rid of #portfolio and place these divs inside .content.

Float it to the left too?

Yes, left or right; it won’t make any difference, as it will be full width. Actually, you don’t need to float it at all, but if you don’t, make sure to add clear: both to the CSS for that div. Not floating it will have the advantage that the .content div will enclose all of the content nicely.

Okay…I’ll give it a try!