CSS behaves weird with IE-6
Posted: Thu Jun 04, 2009 4:09 pm
Hello, I am a first time CSS coder. I tried making a simple page using CSS + Table but it starts behaving awkwardly with IE. it works fine with Chrome and Firefox.
I am attaching the views with both IE and Chrome.
And here is the code
I am attaching the views with both IE and Chrome.
And here is the code
Code: Select all
<style>
.header_image {
background-image: url('header.jpg');
margin-top: 1px;
height: 95px;
width: 1000px;
}
table.navbar {
width:1000px;
padding-left: 30px;
padding-top: 65px;
}
td.navigation {
height: 30px;
text-align: center;
}
.nav_font {
font-weight: bold;
color: #15317E;
font-face: tahoma;
font-size: 15px;
}
.nav_font_selected {
font-weight: bold;
color: white;
font-face: tahoma;
font-size: 15px;
}
td.selected {
background-color: #41627E;
height: 30px;
font-weight: bold;
text-align: center;
font-color: #FFFFF;
}
body.index {
background-color:#41627E;
}
.central_box {
background-color: #659EC7;
border-left: 4px solid white;
border-right: 4px solid white;
width: 950px;
height: 250px;
align: center;
}
.offers_box {
margin-left: 10px;
float: left;
background-image: url('boxnew.png');
repeat: no-repeat;
width: 272px;
height: 230px;
padding-left: 2px;
padding-right: 2px;
text-align:center;
}
.offers1_box {
margin-right: 10px;
float: right;
background-image: url('boxnew.png');
repeat: no-repeat;
width: 272px;
height: 230px;
padding-left: 2px;
padding-right: 2px;
text-align:center;
}
.style1 {
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
</style>
<title>Test page</title>
<body class="index">
<div class="header_image">
<table class="navbar">
<tr>
<td class="selected"><div class="nav_font_selected">Home</div></td>
<td class="navigation"><div class="nav_font">Search Ads</div></td>
<td class="navigation"><div class="nav_font">Feedback Point</div></td>
<td class="navigation"><div class="nav_font">Reward Point</div></td>
<td class="navigation"><div class="nav_font">Coupons</div></td>
<td class="navigation"><div class="nav_font">Book An Ad</div></td>
<td class="navigation"><div class="nav_font">Review</div></td>
<td class="navigation"><div class="nav_font">SignUp</div></td>
<td class="navigation"><div class="nav_font">Find A Friend</div></td>
</tr>
</div>
<table style="margin-top:10px;" align="center"><tr><td><img src="box1.png">
<div class="central_box">
<div class="offers_box">
<h3><span class="style1">Write Reviews on products</span><br>
</h3>
</div>
<div class="offers1_box">
<h3><span class="style1">Write Reviews on products</span><br>
</h3>
</div>
</div>
<img src="boxlow.png">
</td>
</tr></table>
</body>