Hey just signed up today so im a newbie

 

Would anyone know how to make a css navigation bar like this website has > B&Q

 

Notice how the colours for "eco" tab turn green and the "offers" tab turns red as opposed to orange like the rest.

 

I wouldn't mind having something like this for my navigation.

 

 

Thanks

Edited February 14, 201214 yr by spartan sean

It is jut done using CSS and the hover attribute.

 

These can be changed to what ever you want.

 

If you are looking for some inspiration take a look at Stu Nicholls CSS menu section

As mentioned, this can be done with CSS. Give the button a unique class and then give that class the relevant hover attibute to make it green or whatver other colour you want

 

If you view the source and CSS (use the web developer tool bar for Firefox) you will be able to see how they have done it. I hope that helps.

Edited February 14, 201214 yr by nublue

Thanks guys

 

So i can give say for instance the "home" button a different colour by giving it its own unique class? And it wont overwrite the other ones what so ever? Because last time i tried it did that.

Thanks guys

 

So i can give say for instance the "home" button a different colour by giving it its own unique class? And it wont overwrite the other ones what so ever? Because last time i tried it did that.

 

 

Yes, if the element a unique class name and you create a CSS class for it then you're style will affect only that element.

 

If you find that the class affects all items you're probably assigning the class name to the parent item rather than the individual element.

Indeed For some menus I have used a list with each <li> having it's own ID such as "home", "about" etc.

It means you have what ever you want when you hover, when it's active, visited etc.