Xml/Xslt - Code not working, kindly clarify. - Asked By Barath on 25-Feb-13 05:28 AM

body
{
  width:1024px;
  margin:0 auto;
  font-family: Arial, Helvatica and Sans-serif;
  font-size:12px;
  line-height:1.2;
  /*background:#990000;*/

}

#menu
{
  float:left;
  background:#fff;
  margin-left:128px;
  /*border: 2px solid red;*/
  padding:0 auto;
}

ul.nav
{
  /*border:1px solid red;*/
  float:left;
  display:inline;
  padding:0;
  background: -moz-linear-gradient(bottom, #CC7A00 0%, #ff9900 100%);
  border-radius:6px;
}

ul.nav li
{
  display:inline;
  list-style:none;
  float:left;
  /*border:1px solid #cccccc;*/
  position: relative;
  border-radius:6px;
}

ul.nav li a
{
  float:left;
  width:150px;
  text-align:center;
  padding-top:7px;
  padding-bottom:7px;
  text-decoration:none;
  font-weight:bold;
  color:#5f5f5f;
  background: -moz-linear-gradient(bottom, #CC7A00 0%, #ff9900 100%);
  border-radius:6px;
}

ul.nav li a:hover
{
  background-color:#5f5f5f;
  background: -moz-linear-gradient(bottom, #ff9900 0%, #CC7A00 100%);
  color:#f5f5f5;
}


ul.nav ul
{
  float:left;
  list-style:none;
  position:absolute;
  border:1px solid red;
  padding:0;
  left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
  background: -moz-radial-gradient(bottom, #CC7A00 0%, #ff9900 100%);
  border-radius:6px;
}

ul.nav ul a, ul.nav ul li
{
  background:none;
  border-bottom:1px solid #9e6309;
}

ul.nav li:hover ul
{
 left:0; /* Bring back on-screen when needed */
 margin-top:29px;
 *margin-top:28px;
 border:0;
}

______________________________________________________________________



<!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">
<title>MENU TEST</title>
<link type="text/css" rel="stylesheet" href="menustyle.css" />
<body>
<div id="menu">
<ul class="nav">
<li><a href="#">HOME</a></li>
<li><a href="#">ABOUT US</a>
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
<li><a href="#">Link 5</a></li>
</ul></li>


<li><a href="#">OUR PRODUCTS</a></li>
<li><a href="#">OUR CLIENTS</a>
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
<li><a href="#">Link 5</a></li>
</ul></li>
<li><a href="#">CONTACT US</a></li>
</ul><!--nav-->
</div><!--menu-->
</body>
</html>