Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Apr 2005
    Posts
    31
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Aligning sub-menu

    I've changed my dropdown menu to the one at www.brothercake.com, and i had some trouble centering it. I managed to do this by putting it inside a table. But now the sub-menus aren't lineing up.

    Link: www.suncom.com.au/page2

    Code:
    Code:
    body
    {
    	text-align: center;
    	margin:0 0 0 0;
    	margin-right: 0px;
    }
    
    
    table,td,tr
    {
    	background-image:url(../img/scmenu.gif);
    	background-repeat: no-repeat;
    	border: 0px solid #000000;
    	border-spacing: 0px;
    	border-collapse: collapse;
    	width: 755px;
    	height: 181px;
    	text-align: left;
    	padding-left:0px;
    	padding-top:0px;
    	padding-right:0px;
    	vertical-align: top;
    }
    
    
    #menu
    {
    	margin:0 0 0 -12px;
    	width: 755px;
    	text-align:center;
    } 
    
    
    
    ul.horizontal, ul.horizontal li 
    {
    	margin:0px;
    	padding:0px;
    	list-style-type:none;
    	font-size:100%;
    }
    
    ul.horizontal 
    {
    	position:normal;
    	width:770px;
    	cursor:default;
    	z-index:2000;
    	top:3pt;
    	padding-left:0px;
    	padding-right:0px;
    }
    
    ul.horizontal li 
    {
    	width:126px;
    	float:left;
    	position:relative;
    	cursor:pointer;
    	cursor:hand;
    	text-align:left;
    	left:0;
    	margin:0 0 0 -1px;
    }
    	
    * html ul.horizontal li
    {
    	margin:0 0 0 0;
    }
    
    ul[class^="horizontal"] li 
    {
    	margin:0 0 0 0;
    }
    
    ul.horizontal ul 
    {
    	z-index:2020;
    	padding:0;
    	cursor:default;
    	position:absolute;
    	top:auto;
    	width:100%;
    	margin:0 0 0 0;
    	left:-100000px;
    	filter:alpha(opacity=78);
    }
    	
    ul.horizontal ul li 
    {
    	width:100%;
    	left:auto;
    	margin:-1px 0 0 0;
    }
    
    ul.horizontal ul.wider, ul.horizontal ul.wider li 
    {
    	width:115%;
    }
    
    ul.horizontal ul ul 
    {
    	margin:-0.45em 0 0 7.65em;
    }
    
    @media Screen, Projection 
    { 
    	ul.horizontal li:hover > ul { left:auto; }
    	ul.horizontal ul li:hover > ul { top:0; }
    }
    
    ul.horizontal a, ul.horizontal a:visited 
    {
    	display:block;
    	cursor:pointer;
    	cursor:hand;
    	background:#0050bb;
    	border:1px solid #ffffff;
    	padding:4px 7px;
    	font:normal normal bold 11px tahoma, verdana, sans-serif;
    	color:#ffffff;
    	text-decoration:none;
    	letter-spacing:1px;
    }
    	
    ul.horizontal a:hover, ul.horizontal a:focus, ul.horizontal a.rollover, ul.horizontal a.rollover:visited 
    {
    	background:orange;
    	color:#ffffff;
    }
    
    
    
    ul.horizontal a { float:left; }
    @media Screen, Projection { ul.horizontal a { float:none; } }
    ul.horizontal a:not(:nth-child(n)) { float:left; }
    ul.horizontal ul a { float:none !important; }
    @media screen, projection {
    	* html ul.horizontal li {
    		display:inline; 
    		f\loat:left; 
    		background:#ffffff; 
    		}
    	}
    * html ul.horizontal li { position:static; }
    * html ul.horizontal a { position:relative; }
    ul[class^="horizontal"] ul { display:none; }
    ul[class^="horizontal"] ul { display:block; }

  • #2
    Regular Coder
    Join Date
    Sep 2004
    Posts
    202
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Page cannot be found... Problem solved?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •