October 12th, 2008, 04:25 PM
|
|
Registered User
|
|
Join Date: Oct 2008
Posts: 3
Time spent in forums: 44 m 38 sec
Reputation Power: 0
|
|
|
Disappearing image in IE
This is the first page I've made in CSS and am just putting together the basic structure. In firefox, everything works as it should. I used a .png with transparency for a header element(picture of buildings) and floated the transparent nav-bar over that. Pictures below show firefox and IE results. Notice how the image doesn't even show up at all in IE. I cannot figure this out, it's probably something I just don't know about yet but it's driving me freakin crazy
Firefox: (how it should look-space between H and t)
h ttp://i3.photobucket.com/albums/y100/timcorley/firefox.jpg
IE: how it looks in IE
h ttp://i3.photobucket.com/albums/y100/timcorley/IE.jpg
My code might have some issues as I've never really done this before, but I appreciate the help.
CSS:
Code:
html, body {
background:#1d1d1d;
margin: 0;
padding: 0;
}
h1,h2 {
margin: 0;
padding: 0;
}
#page-container {
width:860px;
margin:auto;
}
#branding {
background: url(../images/luxeheaderbgrnd.png) repeat-x;
height: 117px;
}
#branding a{
text-indent:-9999px;
display:block;
width: 200px;
}
#branding h1 a{
height:113px;
background:url(../images/logo.png) no-repeat;
}
#header {
background: url(../images/h2bgrnd.gif) repeat-x;
height: 247px;
}
#header h2{
position:relative;
width:465px;
height:301px;
float: right;
margin-top: -60px;
margin-left: 200px;
margin-right: 20px;
z-index:2;
}
#main-nav {
background:url(..images/navbartrans.png);
position:relative;
height:53px;
width:860px;
float:left;
margin-top:-52px;
z-index:3;
}
#features h1 {
background: url(../images/features.gif);
width:860px;
height:248px;
}
#footer {
background: yellow;
height:20px;
}
|
Dev Shed Forums Sponsor:
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
