I created a simple inline scrollbar but I doesn't scroll in IE. It just cuts of. I should add that n FF it scrolls y-axis. which of course i don't want.
How can I resolve this. Here is the code

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>futureistoday inline scrollbar problem</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type="text/css">
<!--
/* remove those scrollbars */
body {overflow: hidden; } 

#window {
overflow-x: hidden; background-color: #F5F5F5; width: 80&#37;; height: 160px; border: double;
border-color: #CCCCCC; left: 100px; position: absolute;
}

#window2 {
position: relative; overflow-x: scroll; background-color: #AAA; width: 200%;
height: 100%; border-color: #CCCCCC;
}

.urls {
list-style: none;
}
.urls li {
display:inline; height:95px; width:95px; margin:3px; padding-top: 10px; left: -35px;
position: relative;
}
.urls a {
display:block; width:100px; height:100px; border:1px solid #000;  text-decoration:none; background:#697210;
}
.urls a:hover {
background:#000;
}

-->
</style>
</head>

<body>

<div id="window">
<span id="window2">
<ul class="urls">
<li><a href="http://www.google.com/"></a></li>
<li><a href="http://www.bbc.co.uk/"></a></li>
<li><a href="http://www.nba.com/"></a></li>
<li><a href="http://www.w3.org/"></a></li>
<li><a href="http://reference.sitepoint.com/"></a></li>
<li><a href="http://www.codehelp.co.uk/"></a></li>
<li><a href="http://www.javathinking.com/"></a></li>
<li><a href="http://www.novell.com/"></a></li>
</ul>
</span>
</div>

</body>
</html>
or a link to try out:
http://futureistoday.homeunix.net:80...r-problem.html