- This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
Viewing 5 posts - 1 through 5 (of 5 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
I have only basic HTML knowledge and virtually no CSS knowledge. I have got a template for a simple nav bar to use on a website I manage but I cannot get the navbar to centre on the page. Any help please.
This is what I have so far.
ul {list-style: none;padding: 0px;margin: 0px;}
ul li {display: block;position: relative;float: left;border:1px solid #000}
li ul {display: none;}
ul li a {display: block;background: #000;padding: 5px 10px 5px 10px;text-decoration: none;
white-space: nowrap;color: #fff;}
ul li a:hover {background: #f00;}
li:hover ul {display: block; position: absolute;}
li:hover li {float: none;}
li:hover a {background: #f00;}
li:hover li a:hover {background: #000;}
#drop-nav li ul li {border-top: 0px;}
Please provide a minimal demo in Codepen.io which demonstrates the issue rather than a randome piece of CSS.
But the first thing to do is remove float: left
from the li
and perhaps add text-align:center
to the ul
.
Hello
Not sure exactly what I need to do I have had a go link below – obviously it is not quite right but I just want to centre the image horizontally on the image below it.
Frankly, the HTML is a mess of obsolete elements (font
) and inline attributes (align
) which need to be stripped out.
In addition, it looks like the HTML is structured incorrecttly for a menu/submenu option.
Removing the incorrect structure and adjusting a couple of other things can get you started