Hi all
I have the following html page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="test_style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div class="selected_menu_tab">
<div class="test">
<img src="/02/images/arrow.gif" /<a class="menu_link"
href="index.php">Index</a>
</div>
</div>
<div class="selected_menu_tab">
<div class="test">
<img src="/02/images/arrow.gif" /<a class="menu_link"
href="index.php">Index</a>
</div>
</div>
</body>
</html>
and the following css file:
..selected_menu_tab{
float:left;
width:auto;
background-image:url('/02/images/selected_tab.jpg');
background-repeat:no-repeat;
height:45px;
padding-left:3px;
padding-right:3px;
}
..test{
height:20px;
padding-top:25px;
}
Well, in ie7 and ff the code works, which means that the two big divs
are displayed one after the other, horizontally. But in IE 6 it doesnt
work. The second big dig is rendered at the bottom of the first big
div. Please have a look at this page so you can understand what I
mean:
http://bartenderskolan.com/test/ngroup.html
Can anyone help me to solve this isssue?