<!DOCTYPE html> <html> <head> <style> #nav-container ul{ list-style-type:none; background-color:rgb(26,161,242); width:100%; float:left; padding:20px 0px; } #nav-container ul li{ float:left; } #nav-container ul li a{ text-decoration:none; font-size:16px; padding:20px 10px; /* Equal to padding of ul i.e. 20px 0px */ background-color:rgb(26,161,242); color:rgb(255,255,255); border-right:1px solid rgb(210,210,210); } </style> </head> <body> <nav id="nav-container"> <ul> <li><a href="#">list item1</a></li> <li><a href="#">list item2</a></li> <li><a href="#">list item3</a></li> <li><a href="#">list item4</a></li> </ul> </nav> </body> </html>
Run
×
Share