Help with Bootstrap NavBar Styling

[NghiQuach]

Hey guys, I’m new to web designing and i’ve been working with bootstrap for the past week. I was wondering what would be the best way for me to have a header image in the background of my nav bar and my navbar to respond in the correct way. Kind of how the CSS-Tricks navbar is with its background.

[NghiQuach]

In other words, I’d like to have my navigation positioned below the header image, but overlapping part of the image. You can see CSS-Tricks orange part is on the left and above the nav menu.

[scottdc]

Hey,
I think what you are talking about / trying to do is achieved using z-index and negative margins. The z-index alters the stacking order and negative margins will allow one div to ‘slide’ underneath another. Only works on ‘positioned’ elements though so absolute, relative etc.

There is a tut on CSS Tricks .
https://css-tricks.com/almanac/properties/z/z-index/

[NghiQuach]

Nice this is what I was looking for and got it to work thanks @scottdc!

[Author]

Posts