Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Senior Member Andrew Yurlov's Avatar
    Join Date
    Apr 2011
    Location
    Portland, OR
    Posts
    1,306
    Member #
    27566
    Liked
    181 times
    I'm having a problem centering a div.
    Heres what im dooing.

    HTML:

    <div id="header">
    <div id="alignment_header">
    </div>
    </div>

    The header is the whole header part. Its width is 100% which means I cant make my logo be in the same position for every resolution. So, to solve that problem I'm trying to make a second header withing the header. This header is supposed to be 990px wide to fix any resolution. It is supposed to be centered in the middle so my logo and other header content shows up in the same position regardless of resolution. The problem is, is that the "alignment_header" is not centering.

    CSS:

    #alignment_header{
    margin: 0px auto 0px auto;
    width: 990px;
    height: 190px;
    position: absolute;
    background-color: #f6f6f6;
    border: 1px solid red;
    }

    #header{
    margin: 0px auto 0px auto;
    width: 100%;
    height: 190px;
    position: absolute;
    background-color: #f6f6f6;
    }

    I have no idea on what to do. I've tried everything and I need help. If what i'm trying to achieve can be done some other please do tell.

    EDIT: Here is an example of whats happening. http://iztudioz.hostei.com/redesign/ as you can see the red box is not centering within the header.

    Thanks.
    Artificial intelligence is nothing compared to natural stupidity -Someone

    Design is a funny word. Some people think design means how it looks.
    But of course, if you dig deeper, itís really how it works.
    -Steve Jobs



  2.  

  3. #2
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    The problem is "position: absolute". Why do you need absolute positioning anyway?

  4. #3
    Senior Member Andrew Yurlov's Avatar
    Join Date
    Apr 2011
    Location
    Portland, OR
    Posts
    1,306
    Member #
    27566
    Liked
    181 times
    Quote Originally Posted by smoseley, post: 221319
    The problem is "position: absolute". Why do you need absolute positioning anyway?
    the position absolute on the "alignment_header"?
    no I don't need it il try to do it without.
    Artificial intelligence is nothing compared to natural stupidity -Someone

    Design is a funny word. Some people think design means how it looks.
    But of course, if you dig deeper, itís really how it works.
    -Steve Jobs



  5. #4
    Senior Member Andrew Yurlov's Avatar
    Join Date
    Apr 2011
    Location
    Portland, OR
    Posts
    1,306
    Member #
    27566
    Liked
    181 times
    Quote Originally Posted by smoseley, post: 221319
    The problem is "position: absolute". Why do you need absolute positioning anyway?
    Lol. Can't believe it was so easy. Thank you so much.
    Artificial intelligence is nothing compared to natural stupidity -Someone

    Design is a funny word. Some people think design means how it looks.
    But of course, if you dig deeper, itís really how it works.
    -Steve Jobs



  6. #5
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    Anytime bud.

  7. #6
    WDF Staff George Dolidze's Avatar
    Join Date
    Apr 2011
    Location
    Irvine, CA
    Posts
    2,487
    Member #
    27540
    Liked
    416 times
    Don't just use absolute positioning willy-nilly! It's horrible, you almost never need it.
    AlphaMare likes this.
    My freelancer website: DolidzeDesign



    You only need a parachute if you plan on skydiving twice.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 04:01 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com