IE6,IE7 css menu ul

I think this is a trivial problem:

All browsers and IE 8+ display my ul menu :

but IE6 and IE7 display:

Any soltion for this problem? CSS:

div.art-nav
{
  position: relative;
  height: 25px;
  z-index: 100;
}

.art-nav .l, .art-nav .r
{
  position: absolute;
  z-index: -1;
  top: 0;
  height: 25px;
  background-image: url('images/nav.png');
}

.art-nav .l
{
  left: 0;
  right: 15px;
}

.art-nav .r
{
  right: 0;
  width: 1040px;
  clip: rect(auto, auto, auto, 875px);
}

/* begin MenuSeparator */


ul.art-menu ul.art-menu-li-separator
{
  display: block;
  width: 1px;
  height: 25px;
}

.art-nav ul.art-menu-separator
{
  display: block;
  margin:0 auto;
  width: 1px;
  height: 25px;
  background-image: url('images/menuseparator.png');
}
/* end MenuSeparator */
ul.art-menu ul a
{
  display: block;
  text-align: center;
  white-space: nowrap;
  height: 32px;
  width: 180px;
  overflow: hidden;
  line-height: 32px;
  background-image: url('images/subitem.png');
  background-position: left top;
  background-repeat: repeat-x;
  border-width: 0;
  border-style: solid;
}

ul.art-menu ul a, ul.art-menu ul a:link, ul.art-menu ul a:visited, ul.art-menu ul a:hover,ul.art-menu ul a:active, .art-nav ul.art-menu ul span, .art-nav ul.art-menu ul span span
{
  text-align: left;
  text-indent: 12px;
  text-decoration: none;
  line-height: 32px;
  color: #FFFFFF;
  margin-right: 10px;
  margin-left: 10px;
  font-size: 13px;
  margin:0;
  padding:0;
}

ul.art-menu ul li a:hover
{
  color: #000000;
  background-position: 0 -32px;
}

ul.art-menu ul li:hover>a
{
  color: #000000;
  background-position: 0 -32px;
}

.art-nav ul.art-menu ul li a:hover span, .art-nav ul.art-menu ul li a:hover span span
{
  color: #000000;
}

.art-nav ul.art-menu ul li:hover>a span, .art-nav ul.art-menu ul li:hover>a span span
{
  color: #000000;
}
************************/

HTML:

<div class="art-nav">
                &nbsp;&nbsp;&nbsp;
        <a href="javascript:__doPostBack('ctl00$lbLang','')" id="ctl00_lbLang"><span class="l"></span><span class="r"></span><span class="t"><img border="0" src="slm/me.jpg"></span></a>
        <a href="jav开发者_JAVA百科ascript:__doPostBack('ctl00$lbLangJez2','')" id="ctl00_lbLangJez2"><span class="l"></span><span class="r"></span><span class="t"><img border="0" src="slm/UNKG1.jpg"></span></a>
                    <div class="l"></div>
                    <div class="r"></div>
                    <ul class="art-menu">
                        <li>

        <a href="News.aspx" class="active" id="ctl00_hlNovosti"><span class="l"></span><span class="r"></span><span class="t">Novosti</span></a>
                        </li><li class="art-menu-li-separator"><span class="art-menu-separator"></span></li><li>
        <a href="roules.aspx" class="active" id="ctl00_hlPravilaKladjenja"><span class="l"></span><span class="r"></span><span class="t">Pravila kladjenja</span></a>
                        </li><li class="art-menu-li-separator"><span class="art-menu-separator"></span></li><li>
        <a href="onama.aspx" class="active" id="ctl00_hlOnama"><span class="l"></span><span class="r"></span><span class="t">O nama</span></a>
                        </li><li class="art-menu-li-separator"><span class="art-menu-separator"></span></li><li>
        <a href="UplatnaMesta.aspx" class="active" id="ctl00_hlUplatnaMesta"><span class="l"></span><span class="r"></span><span class="t">Uplatna mesta</span></a>
                        </li>
                    </ul> 
                </div>

---

Might have something to do with this

clip: rect(auto, auto, auto, 875px);

in

.art-nav .r

IE doesn't do well with clip

http://reference.sitepoint.com/css/clip

See if removing that fixes it... and if so, you can send a modified css to IE using conditional comments.