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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<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 {



<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>

or a link to try out: