Centering multiple images in a row

Discussion in 'Web Design and Development' started by Xavier, Dec 4, 2010.

Most Liked Posts
  1. Xavier, Dec 4, 2010

    Xavier macrumors 68030

    Joined:
    Mar 23, 2006
    Location:
    Columbus
    #1
    I am fairly new to html/css and need some help!

    I am constructing a personal website to house my resume and content that I have accomplished over my college career.

    What I would like to do is have multiple images, not overlapped, in a row, but also have them always centered in the page. Here is what I have in mind:
    [​IMG]



    Also here is some code that i am using for text. I want the images to behave the same way, but be in a row.

    #caption2
    {
    font-size: 50px;
    font-family: "Tall Films";
    margin-left: -300px;
    text-align: center;
    position: absolute;
    top: 15%;
    left: 50%;
    width: 600px;
    height: auto;
    visibility: visible;
    display: block
    }

    Any help?
     
    share
    + Quote Reply
  2. definitive, Dec 4, 2010

    definitive macrumors 68000

    definitive

    Joined:
    Aug 4, 2008
    #2
    hm, there are several ways of doing it. i don't have the time to code the stuff at the moment, but off the top of my head, you could probably use an unordered list to have the boxes listed inline (horizontally) inside a wrapper, and space them apart with something like "padding-right: 5px;" for the li tag.
     
    share
    + Quote Reply
  3. Caleb531, Dec 4, 2010

    Caleb531 macrumors 6502

    Caleb531

    Joined:
    Oct 17, 2009
    #3
    Easiest way to center everything (this goes in your CSS):

    Code:
    body, body * {
text-align: center;
margin-left: auto;
margin-right: auto;
}
    Just make sure the images are all next to each other in your HTML.
     
    share
    + Quote Reply
  4. Xavier, Dec 5, 2010

    Xavier thread starter macrumors 68030

    Joined:
    Mar 23, 2006
    Location:
    Columbus
    #4
    I got it to work using a variation on your css. Happy!

    Thank you
     
    share
    + Quote Reply
(You must log in or sign up to post here.)

Share This Page