SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Evangelist
    Join Date
    Mar 2011
    Location
    Bellingham, WA
    Posts
    450
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Parts of my page move while others don't

    Hello!

    I'm developing a new website and am having a problem; when I resize my window, everything "moves" correctly except for my login and "sitetools" (logout, admin buttons) which I've placed in the banner. In addition, I've noticed on different size screens it winds up in surprising places. I think that it may be due to my lack of understanding as to what absolute and relative positioning do (this is my level of CSS knowledge!), but Icould be mistaken.

    Anyway, the problem can be seen at:
    myalgebrabook.com

    On that page, I've included what should be the necessary CSS to point out the issue; however, I'd be more than happy to provide the more complete style sheet for my site if you might think that it's due to some sort of weird Cascading.

    Thank you for looking into this.

    -Eric

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,097
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    An element that is positioned absolutely will be positioned in relation to its nearest parent that has position absolute or relative. In the absence of such a parent, the viewport gives the positioning context.

    In your case, you need to add position: relative to the header div:

    Code:
    #header {
    	background: url('/images/Banner.jpg');
    	height: 120px;
    	width: 960px;
            position:relative;
    }
    You may also want to change the positioning of the form, as it will move position a little bit now that it is measuring its position from the left side of the header.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  3. #3
    SitePoint Evangelist
    Join Date
    Mar 2011
    Location
    Bellingham, WA
    Posts
    450
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Thanks so much for such a clear answer; it was both easy to implement the change, and I have a much better understanding of how "position" works.

    -Eric


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
  •