Irina

.logo {
height: 44px; width: 300px;
background: url(../../Images/logo.png) no-repeat;
_behavior: expression( /* IE6 only – transparency with proper handling of relative URLs */
this.src = this.src ? this.src : this.currentStyle.backgroundImage.split(’”‘)[1],
this.style.background = “none”,
this.style.filter = “progid:DXImageTransform.Microsoft.AlphaImageLoader(src=” + this.src + “)”);
}

Or in the head tag of the html page, you had to put this code

<!–[if lt IE 7]>
<style type=”text/css”>
.download_leftsidebar_back {
background-image: none !important;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader
(sizingMethod=scale, src=’App_Themes/Default/images/download_leftsidebar_back.png’) ;

}
</style>
<![endif]–v

And i saw another very good idea http://www.komodomedia.com/blog/2007/11/css-png-image-fix-for-ie/

.select {
height:20px;
_height:20px;
border: 1px solid #BFBFBF;
}
.input {
border: 1px solid #BFBFBF;
width: 150px;
line-height: 12px;
position: absolute;
top: 0;
padding: 3px 0 0 0;
height: 22px;
margin-right: 3px;
color: gray;
font-size: 12px;
font-family: Arial;
}
.left {
float:left;
}
.button {
border: 1px solid #cecece;
position: absolute;
top: 0;
color:#fff;
background:#edeced;
color: #326bb7;
font-size: 12px;
font-family: Arial;
height: 22px;
width:80px;
}

<div style=”position: absolute;”>
<div class=”left”><input type=”text” class=”input” value=”irina” /></div>
<div class=”left” style=”padding-left: 155px;”>
<select name=”aa” class=”select”>
<option selected>First</option>
<option>Second</option>
<option>Third</option>

</select></div>
<div style=”position: absolute; top: 0; left:240px;”><input type=”submit” Value=”Submit” class=”button” /></div>
</div>

Another example about Rounded Corners without Images using only CSS.

Here is the css code for rounded corners.

h1,p{margin: 0 10px}
h1{font-size: 250%;color: #FFF}
p{padding-bottom:1em}
div#nifty{ margin: 0 10%;background: #9BD1FA}
b.rtop, b.rbottom{display:block;background: #FFF}
b.rtop b, b.rbottom b{display:block;height: 1px;overflow: hidden; background: #9BD1FA}
b.r1{margin: 0 5px}
b.r2{margin: 0 3px}
b.r3{margin: 0 2px}
b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}

And here is the html code

<div id=”nifty”>
<b class=”rtop”><b class=”r1″></b><b class=”r2″></b><b class=”r3″></b><b class=”r4″></b></b>
<h1>Nifty Corners</h1>
<p> <!–content goes here–> </p>

<b class=”rbottom”><b class=”r4″></b><b class=”r3″></b><b class=”r2″></b><b class=”r1″></b></b>
</div>

Here you can find more example how to make rounded corners without images http://www.html.it/articoli/nifty/index.html

I’ve made a research, how to make rounded corners without using any images. And here is what I found.

http://www.html.it/articoli/niftycube/index.html

It’s not very simple, because this example use Javascript. But it works on IE6, IE7 and Firefox.

If you want to make counter list you have to use CSS2. But here is the problem. IE6 don’t support CSS 2. Here is the code to do those list.

Css code

.list {
counter-reset:chapter;
}

div {
margin-left:1em;
}

p {
padding:0;
margin:0 0 0 3em;
border:0;
}

.list div:before {
content: counter(chapter) “. “;
counter-increment: chapter; /* Add 1 to chapter */
}

.list div {
counter-reset: section; /* Set section to 0 */
}

p:before {
content: counter(chapter) “.” counter(section) ” “;
counter-increment: section;
}

And the HTML Code is

<div class=”list”>

<div>Sweet</div>
<div>Salty</div>

<p>Very Salty</p>
<p>Lightly Salted</p>
<div>Bitter</div>
<div>Sour</div>
<p>Quite Sour</p>
<p>Very Sour</p>

</div>

And here is the view

Over the last few years web-developers have written many articles about CSS and developed many useful techniques, which can save you a lot of time – of course, if you are able to find them in time. In this site you can find almost everything
www.smashingmagazine.com

label,input {
display: block;
width: 150px;
float: left;
margin-bottom: 10px;
}

label {
text-align: right;
width: 55px;
}
br {
clear: left;
}