html - z index background issue in IE -


I have a jQuery tool scroller, which is installed with the management of two different devices of information - one image , Other related text, sitting on top of images with a transparent BG image I am using Z-indexing to get it and I know about IE issues but I am unable to sort it Tested in IE 6-8). Image of the image below:

It seems that the overlay diva is taking white on the containers. As much as possible, I can not solve it HTML / CSS code below:

  & lt; Div id = "content" & gt; & Lt; Div id = "nav" & gt; & Lt; / Div & gt; & Lt; Div class = "s4 slideshow" & gt; & Lt; Div & gt; & Lt; Img src = "& lt ;? php bloginfo ('stylesheet_directory') ;? & gt; /images/hero_1_white.jpg" width = "770" height = "367" /> & Lt; / Div & gt; & Lt; Div & gt; & Lt; Img src = "& lt ;? php bloginfo ('stylesheet_directory') ;? & gt; /images/hero_1_white.jpg" width = "770" height = "367" /> & Lt; / Div & gt; & Lt; Div & gt; & Lt; Img src = "& lt ;? php bloginfo ('stylesheet_directory') ;? & gt; /images/hero_1_white.jpg" width = "770" height = "367" /> & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div id = "overlay_bg" & gt; & Lt; / Div & gt; & Lt; Div class = "s4 info" & gt; & Lt; Div & gt; & Lt; H1 & gt; Support & lt; / H1> & Lt; P & gt; How is this possible? Anne Socysasses Nala Vite & Lt; / P & gt; & Lt; P & gt; & Lt; A href = "#" & gt; Support us & lt; / A & gt; & Lt; / P & gt; & Lt; / Div & gt; & Lt; Div & gt; & Lt; H1 & gt; Events & lt; / H1> & Lt; P & gt; Consultancy Lessgast A and Reading, Pillia or Vallet. Anne Socysasses Nala Vite & Lt; / P & gt; & Lt; P & gt; & Lt; A href = "#" & gt; Read more & lt; / A & gt; & Lt; / P & gt; & Lt; / Div & gt; & Lt; Div & gt; & Lt; H1 & gt; Regional & lt; / H1> & Lt; P & gt; How is this possible? Anne Socysasses Nala Vite & Lt; / P & gt; & Lt; P & gt; & Lt; A href = "#" & gt; Support us & lt; / A & gt; & Lt; / P & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt ;! - End of content - & gt; # Content {height: auto; Minimum height: 300px! Important; Hidden flurry; Status: Relative; Margin-left: 27px; Width: 770px; Padding-down: 43px; } # Nav {width: 60px; Z-index: 10000; Status: Completed; Top: 340px; Left: 28px; } .s4 {width: 770px; Height: 370px; Hidden flurry; } # Navs {background color: transparent; Background-image: url (image / transition page); Background-position: 0; Text Indent: -1000m; Width: 10px; Height: 10px; Display area; Swim left; Margin-right: 5px; } #nav a.activeSlide {background-position: 0 -10px; } # Overlay_bg {background: url (image / soft_block) no duplication; Width: 318 pixels; Height: 33 9px; Z-index: 5000; Status: Completed; Top: 28px; }. Information {status: complete; Top: 60px; Left: 28px; Z-index: 16000; Width: 290px; Height: 260px; Color: #fff; }. Information h1 {font-size: 50px; Font style: italic; Text-transform: uppercase; }. Information page {font-size: 17px; Line-height: 27px; Margin-top: 37px; }. Information is a {font-size: 13px; Padding-down: 2px; Border bottom: 1 px solid; Color: #fff; Text-transform: uppercase; Font style: italic; }. Info one: Hover {Color: # 000; }  

Any help would be greatly appreciated.

Is it in every browser or just IE 6? I have received your code for IE 7 & amp; 8 And it appears to be a transparent div fine overlay. In IE 6 I have problems like your image looks like a link if it is only in IE6, then I would say that it is a transparent PNG that you are using as your background. There are some Java hacks that you can use to fix this problem. Before fixing this problem I have used a very good source:


Comments

Popular posts from this blog

windows - Heroku throws SQLITE3 Read only exception -

lex - Building a lexical Analyzer in Java -

python - rename keys in a dictionary -