Results 1 to 3 of 3

Thread: Centering site logo in Header

  1. #1
    Join Date
    Mar 2009
    Posts
    74
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default Centering site logo in Header

    Hello,

    I have a question about header graphics.

    I have four graphics which I'd like to have set up in two rows.

    The first graphic will be buy itself as the site logo centered, directly below will be the three others which I'd like to span across, one on the left, one in the center and one on the right.

    Right now I have that setup but when the window is set at different resolutions the top center graphics move a little to the left or a little to the right depending on the resolution and goes off center.

    How can I stop it from doing that and staying centered?

    Thank you

  2. #2
    Join Date
    Aug 2005
    Location
    Other Side of My Monitor
    Posts
    3,486
    Thanks
    5
    Thanked 105 Times in 104 Posts
    Blog Entries
    1

    Default

    Use percentage declarations in your CSS, after setting the base margins and padding to 0.

    Your CSS would look something like this:

    Code:
    * {
         margin: 0;
         padding: 0;
    }
    
    .header img {
         margin-left: auto;
         margin-right: auto;
         width: 60%;
    }
    Of course the number (60%) is a guess, you will have to play around with it to get it centered, the margin: auto sets it center when a width is declared. For the other 3, just float them, left, center and right. inside the same div or p.
    {CWoT - Riddle } {OSTU - Psycho} {Invasion - Team}
    Follow Me on Twitter: @Negative_Chaos
    PHP Code:
    $result mysql_query("SELECT finger FROM hand WHERE id=3");
    echo 
    $result

  3. #3
    Join Date
    Jan 2010
    Location
    Bangladesh
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Why dont you just use (text-align:center) into your header css
    Last edited by djr33; 04-22-2010 at 09:55 PM. Reason: Signature removed-- wait until 5 posts

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •