Hello to all,
I am completely stumped here and would appreciate any assistance you
folks could offer.
I have created a navigation bar which utilized an background image for
the buttons.
One image when there is no mouse rollover, and anther when there is a
mouse rollover.
The bar works as designed.
It is part of a web page that also houses a logo image above it and a
javascript-based slideshow below it.
All work as designed.
My problem is that I need to center the entire site, and every method
I have employed to do so, centers everything but the navigation bar.
The bar just sits flush to the left-hand side of the page.
Yes..I am using float:left in the CSS sections of the navigation
styling.
I'm assuming that this is what is causing me to have this issue. But I
do not know how else to code the navigation bar in order to get the 6
buttons to line up horizontally with each other.
Here is the code I used to generate the navigation bar. As I said, all
works as designed so I'd hate to have to do
a complete re-design of the bar but I am completely out of ideas as to
how to solve this problem.
Any help would be welcomed.
Thank you.
ul#cssnav {
margin:0 0 2em 17px;
padding:0;
list-style-type:none;
float: left;
}
ul#cssnav li {
position:relative;
font-family: arial, verdana, helvetica, sans-serif;
background: url(../images/rollover2.gif) no-repeat;
float:left;
width: 11em;
height: 4em;
line-height:4em;
text-align:center;
margin-left:-17px;
}
#cssnav li a {
display:block;
width: 11em;
height: 4em;
/* display: block; */
color: #FFF;
text-decoration: none;
background: url(../images/rolloff2.jpg) no-repeat;
font-weight:bold;
}
#cssnav li a:hover,#cssnav li.current a
{background:transparent;color:#000}
/* #navlist li
{
display: inline;
list-style-type: none;
padding-right: 20px;
text-decoration: none;
} */
--
--
You received this because you are subscribed to the "Design the Web with CSS"
at Google groups.
To post: css-design@googlegroups.com
To unsubscribe: css-design-unsubscr...@googlegroups.com
