Html and css nav bar

Community
1

Hi,
Was just looking for help with this section of a web page, the navigation bar. I can create a very basic one but the are a couple aspects that I don’t know hindering me from creating a professional nav bar. such as:
• the spacing between links on the nav bar
• How to change the shape of the nav bar

Is there anyone able to supply me with professional CSS code to make a good nav bar, and to also explain the parts as I need to learn.
thanks for your time.

2

There are plenty of tutorials on how to make good looking nav bars, so i am not going there. You can show the basic one you made and i will give tips for improvement, that i can do :slight_smile:

and @ghostlovescore surely can as well :slight_smile:

2 Likes
3

Couldn’t agree more.

1 Like
4

ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
position: fixed;
}

li {
float: left;
}

li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
.active {
background-color: #4CAF50;
}

li a:hover:not(.active) {
background-color: #111;
}

li:last-child {
border-right: none;
}

5

You can format your code on here, using </> from the text editor menu

1 Like
6

There is no html code included? Please also include html code and use format:

to make html code and indent show

1 Like