Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    May 2011
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    CSS Positioning with Margins

    I have my whole site set up to be centered with all elements (position:absolute within this one div:

    #website {
    position:relative;
    margin:0 auto;
    width:960px;

    How do I add a <div> with a fixed position (stays in the same left and top position as you scroll down) that will be relative to the centered site?

    I tried position:fixed; but it just ignores the margins and a left:60px; is always 60px from the left, no matter how wide the browser window.

  • #2
    Regular Coder Custard7A's Avatar
    Join Date
    Jul 2010
    Location
    Australia
    Posts
    286
    Thanks
    32
    Thanked 33 Times in 33 Posts
    It sounds like you should be using position: absolute, which respects the containing block you put it in, but removes that box from the flow. I'm assuming here that you're wanting to place this box outside the main div (You would place it inside the main div in the code, but position it outside with styling). Using position: fixed is generally only relative to the viewport. I don't understand why you would be using position: absolute on all elements inside your centering div.

  • #3
    New Coder
    Join Date
    May 2011
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I used "position: absolute" for the elements in the centering <div> so that they would disappear as I scrolled down on the site.

    I want a new <div> to be within the centering <div>, but I want it fixed at 60px from the top and 60px from the left of the 960px centering <div> the whole time I scroll down.

    I found margin-left:60px works with position:fixed; but I wondered if there was a better way.

  • #4
    Regular Coder Custard7A's Avatar
    Join Date
    Jul 2010
    Location
    Australia
    Posts
    286
    Thanks
    32
    Thanked 33 Times in 33 Posts
    If your elements in the centering div aren't scrolling away as one would expect from scrolling — when you are using the default positioning that is — then you must be doing something quite unusual to me.

    If you have it working as you want with fixed positioning, then I would say it seems fine to do so. There may be a better way, but using position: absolute on all your centered elements doesn't seem like the best way to do that either.


  •  

    Posting Permissions

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