1,208
I have posted a couple different questions in this thread concerning a menu i had been working on. I have run into another snag in the final stages of the development. I have my current CSS file for my menu(which is posted below), I need to center the menu on the page. My menu starts off at the far left of the screen and spans the whole length of the screen, and i would like to fit under the page heading, since it is quite larger.
Here is my code any help is greatly appreciated.
Expand|Select|Wrap|Line Numbers
- .horizontalcssmenu ul{
- margin: 0;
- padding: 0;
- list-style-type: none;
- }
- /*Top level list items*/
- .horizontalcssmenu ul li{
- position: relative;
- display: inline;
- float: left;
- }
- /*Top level menu link items style*/
- .horizontalcssmenu ul li a{
- display: block;
- width: 100px; /*Width of top level menu link items*/
- padding: 2px 8px;
- border: 1px solid #202020;
- border-left-width: 0;
- text-decoration: none;
- background: url(untitled.bmp) center center repeat-x;
- color: white;
- font: bold 10px Tahoma;
- }
- /*2nd level menu*/
- .horizontalcssmenu ul li ul{
- left: 0;
- top: 0;
- border-top: 1px solid #202020;
- position: absolute;
- display: block;
- visibility: hidden;
- z-index: 100;
- }
- /*2nd level menu list items*/
- .horizontalcssmenu ul li ul li{
- display: inline;
- float: none;
- }
- /* 2nd level menu links style */
- .horizontalcssmenu ul li ul li a{
- width: 130px; /*width of sub menu levels*/
- font-weight: normal;
- padding: 2px 5px;
- background: url(untitled1.bmp) center center repeat-x;
- border-width: 0 1px 1px 1px;
- }
- .horizontalcssmenu ul li a:hover{
- background: url(untitled1.bmp) center center repeat-x;
- }
- .horizontalcssmenu ul li ul li a:hover{
- background: url(untitled2.bmp) center center repeat-x;
- }
- .horizontalcssmenu .arrowdiv{
- position: absolute;
- right: 0;
- background: transparent url(menuarrow.gif) no-repeat center left;
- }
- * html p#iepara{
- padding-top: 1em;
- }
- /*3rd level menu*/
- .horizontalcssmenu ul li ul li ul{
- left: 0;
- top: 0;
- border-top: 0px solid #202020;
- position: absolute;
- left: 80px; /*this is the offset for the sub sub-menu to allow the sub-menu to be seen*/
- display: block;
- visibility: hidden;
- z-index: inherit;
- }
- /*3rd menu list items*/
- .horizontalcssmenu ul li ul li ul li{
- display: inherit;
- float: right;
- }
- /*3rd menu links style */
- .horizontalcssmenu ul li ul li ul li a{
- width:120px; /*width of sub menu levels*/
- display:block;
- font-weight: normal;
- padding: 2px 2px;
- background: url(untitled.bmp) center center repeat-x;
- border-width: 0 1px 1px 1px;
- }
