css z-index question?

interview project

Hi guys,

I had to prepare the above site for an interview today. It isn't displaying properly in interenet explorer. I want the badge in the header/navigation bar to overlap the main content (as it does in firefox, safari etc).

Why is it different in IE? how can i fix this?

thanks alot, Peter

From stackoverflow Peterl86

• Set the z-index on the div that has the id "headerR" to something like 999. I just tried it and it seemed to work.

  From Jason Bunting

• It doesn't work in Firefox 3.0 either. Try using Firebug to inspect the header. You'll see that there is no z-index defined for the image. Once you define a z-index on the image it will correctly pop out front.

  From Todd Price

• It displays the same in IE6, IE7 and Firefox for me. What version are you having problems with?

  Did you figure it out?

  Peterl86 : this was my fault, after i posted the question i was messing about with the code and left it like that. Its fixed now! thanks. HeaderR was where i needed the z-index:1, as a few people said.
  From ZCHudson

• BTW - your "iehack.css" file is missing.

  Since you've put the badge in a reltively positioned DIV, you can safely position it using absolute.

  #badge {
  position:asolute;
  z-index:10;
  top:-71px;
  

  }

  From Diodeus

• add z-index: 1 to your headerR class in the CSS.

  From Joe Basirico

• brilliant; thats it fixed. thanks alot for the tips guys. How good is this site!?

  From Peterl86

• another issue in IE...

  I'll ask here rather than start a new question: the navbar link list has a border applied to the left side of each element. In fireforx/safari this matches up with the navbar background but in IE the border/element spills out below the navbar ( the border sticks out the bottom).

  link

  Any ideas? thanks again.

  Jason Bunting : I know this may sound crazy, but although this is related to the same website, you might want to start a new question so as to keep things compartmentalized. This website is meant to be somewhat a one-question-per-question-page type of place...

  Jason Bunting : Also, I don't see the problem you describe and the link you gave goes to a blank page.

  Peterl86 : thanks fo the tip Jason, ill do that. the link should have been plwd.co.uk/rangers
  From Peterl86