homepage Welcome to WebmasterWorld Guest from 54.237.184.242
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
Center CSS Menu
Rain_Lover




msg:4116565
 8:44 pm on Apr 15, 2010 (gmt 0)

Hi,

How can I center the following menu:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>Generated by PureCSSMenu.com</title>
</head>
<body>



<!-- Css Menu -->

<style>
ul.cssMenu ul{display:none}
ul.cssMenu li:hover>ul{display:block}
ul.cssMenu ul{position: absolute;left:-1px;top:98%;}
ul.cssMenu ul ul{position: absolute;left:98%;top:-2px;}
ul.cssMenu,ul.cssMenu ul {
margin:0px;
list-style:none;
padding:0px 2px 2px 0px;
background-color:#fff;
background-repeat:repeat;
border-color:#808080;
border-width:1px;
border-style:solid;
}
ul.cssMenu table {border-collapse:collapse}ul.cssMenu {
display:block;
zoom:1;
height:21px;
float: left;
}
ul.cssMenu ul{
width:0px;
}
ul.cssMenu li{
display:block;
margin:2px 0px 0px 2px;
font-size:0px;
}
ul.cssMenu a:active, ul.cssMenu a:focus {
outline-style:none;
}
ul.cssMenu a, ul.cssMenu li.dis a:hover, ul.cssMenu li.sep a:hover {
display:block;
vertical-align:middle;
background-color:#FFFFFF;
border-width:1px;
border-color:#fff;
border-style:solid;
text-align:center;
text-decoration:none;
padding:2px 5px 5px 10px;
_padding-left:0;
font:normal 11px Tahoma;
color: #000;
text-decoration:none;
cursor:default;
}
ul.cssMenu span{
overflow:hidden;
}
ul.cssMenu li {
float:left;
}
ul.cssMenu ul li {
float:none;
}
ul.cssMenu ul a {
text-align:left;
white-space:nowrap;
}
ul.cssMenu li.sep{
text-align:left;
padding:0px;
line-height:0;
height:100%;
}
ul.cssMenu li.sep span{
float:none; padding-right:0;
width:3px;
height:100%;
display:inline-block;
background-color:#808080; background-image:none;}
ul.cssMenu ul li.sep span{
width:100%;
height:3px;
}
ul.cssMenu li:hover{
position:relative;
}
ul.cssMenu li:hover>a{
background-color:#DBF0F9;
border-color:#45ADE4;
border-style:solid;
font:normal 11px Tahoma;
color: #444;
text-decoration:none;
}
ul.cssMenu li a:hover{
position:relative;
background-color:#DBF0F9;
border-color:#45ADE4;
border-style:solid;
font:normal 11px Tahoma;
color: #444;
text-decoration:none;
}
ul.cssMenu li.dis a {
color: #557D4F !important;
}
ul.cssMenu img {border: none;float:left;_float:none;margin-right:2px;width:16px;
height:16px;
}
ul.cssMenu ul img {width:16px;
height:16px;
}
ul.cssMenu img.over{display:none}
ul.cssMenu li.dis a:hover img.over{display:none !important}
ul.cssMenu li.dis a:hover img.def {display:inline !important}
ul.cssMenu li:hover > a img.def {display:none}
ul.cssMenu li:hover > a img.over {display:inline}
ul.cssMenu a:hover img.over{display:inline}
ul.cssMenu a:hover img.def{display:none}
ul.cssMenu span{
display:block;
background-image:url(arrv_white.gif);
background-position:right center;
background-repeat: no-repeat;
padding-right:9px;}
ul.cssMenu ul span{background-image:url(arr_black.gif)}
ul.cssMenu ul li:hover > a span{ background-image:url(arr_white.gif);}
ul.cssMenu li.cssMenui0 {
width:110px;
height:23px;
}
ul.cssMenu li a.cssMenui0{
height:100%;
background-image:url(btn3.jpg);
border-width:0px;
font:normal 11px Tahoma;
color:#fff;
}
ul.cssMenu li a.cssMenui0:hover{
background-image:url(btn4.jpg);
font:normal 11px Tahoma;
color:#eee;
}
ul.cssMenum0 {
background-color:transparent;
border-width:0px;
padding:0px 0px 0px 0px;
}
ul.cssMenum0>li>a {
padding:8px 10px 0px 10px;
}
ul.cssMenum0 a {
padding:8px 10px 0px 10px;
}
ul.cssMenum0 ul a {
padding:2px 5px 5px 10px;
}
ul.cssMenum0>li {
margin:0px 0px 0px 0px;
}
ul.cssMenum0 li {
margin:0px 0px 0px 0px;
}
ul.cssMenum0 li li {
margin:2px 0px 0px 2px;
}

</style>

<ul class="cssMenu cssMenum0">
<li class=" cssMenui0"><a class=" cssMenui0" href="" target="_parent">Documents</a></li>
<li class=" cssMenui0"><a class=" cssMenui0" href="" target="_parent">Presentations</a></li>
<li class=" cssMenui0"><a class=" cssMenui0" href="" target="_parent">Spreadsheets</a></li>
<li class=" cssMenui0"><a class=" cssMenui0" href="" target="_parent">Forms</a></li>
<li class=" cssMenui0"><a class=" cssMenui0" href="" target="_parent">PDFs</a></li>
</ul>


<!-- (c) 2009, PureCSSMenu.com -->


<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</body>
</html>



Thanks in advance!
Rain Lover

 

SanDiegoPaul




msg:4116597
 9:55 pm on Apr 15, 2010 (gmt 0)

Put it on a DIV and center the DIV.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved