treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] how to make my header/ navigation follow my slider.

  • seems to be fixed, but when I look it says relative... http://www.detailmonopoly.com

  • I don't understand what are you expecting it to do and when?

  • my header seems to be fixed (position) I want it to be relative to the slider images. So the header isn't in a weird spot.

  • Slight misunderstanding of what display: relative, means me thinks take a look at a css reference about the display property things should become a little clearer

  • I still don't get it...it looks fine.

    Your logo / tabs are stopping it from moving left if that's the issue.

  • If I re-size the window the header doesn't move with the slider.

  • He wants the logo to stay in the same position in relation to the image carosel, when the window gets narrower, however looking at the DOM simplest way I can think of is to wrap another div around the header and the slider and center that using the margin: 0 auto;

    That or drop the logo's div into the slider's div and use absolute to position it as it would be normally.

    Eitherway feels like its a bit hacked. And the second won't work cus I just noticed the overflow hidden

  • yes! thats what I was trying to say haha!

  • try adding or changes these pieces of css

      #header.gallery {
          width: 1020px; /* Same width as the slider has */
      }
    
      #header-logo {
          width: auto;
          margin-left: 130px;
      }
    
      #tabs {
          right: 0;
          margin-left: auto;
      }
    
  • ahhh thanks so much!