I have tried and researched but cant get this to work, i want to put a image border around a ul/li list, why doesnt this work in firefox/chrome yet seems ok ik in ie?
Css *{margin:0px;padding:0px}
#wrapper { width: 1060px; height: 100% }
#content_inner_left{width:180px; float:left; height: 100%}
/* Text Bar */
#text_top{background-image: url('images/nav_01.jpg'); background-repeat: no-repeat; height:5px}
#text_bottom{background-image: url('images/nav_05.jpg'); background-repeat: no-repeat; height:6px; background-position-y:top}
#text_nav{height:100%; background-image:url('images/nav_03.jpg'); background-repeat:repeat-y}
#text_nav ul{list-style-type:none; }
#text_nav li{ float:left; width:170px; margin-left:5px}
#text_nav ul a{text-decoration: none}
#text_nav ul a:hover{color: #0000FF}
html <!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">
<html>
<head>
<title>Template</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="template.css">
</head>
<body>
<div id="wrapper">
<div id="content_inner_left">
<div id="text_top"></div>
<div id="text_nav">
<ul>
<li><a href="#">Home Page</a></li>
<li><a href="#">Home Page</a></li>
<li><a href="#">Home Page</a></li>
<li><a href="#">Home Page</a></li>
<li><a href="#">Home Page</a></li>
</ul>
</div>
<div id="text_bottom"></div>
</div>
</div>
</body></html>
