Facing an issue with IE6 while writing HTML/CSS code.
I am looking to create dynamic divs using classes:
Here is a simple example (not real-project code):
.top {width: 50px;}
.top.selected {background: #f00;}
.mid {width: 114px;}
.mid.selected {background: #0f0;}
.bot {width: 100px;}
.bot.selected {background: #0ff; color: #f00;}
...and so on...
So the HTML structure would be like this:
<div class='top selected'>1</div>
<div class='mid'>2</div>
<div class='bot selected'>3</div>
This setup works perfectly for most browsers, but unfortunately not in IE6.
Only
.topselected {background: #f00;} // <div class='top topselected'>
works as expected, but it's not ideal. Are there any hacks available?