# Is there a way to add more items on this nav bar?

**URL:** <https://forum.kirupa.com/t/is-there-a-way-to-add-more-items-on-this-nav-bar/327350>\
**Category:** Uncategorized\
**Created:** [February 23, 2012, 2:59pm UTC](https://forum.kirupa.com/t/is-there-a-way-to-add-more-items-on-this-nav-bar/327350 "2012-02-23T14:59:47Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![multimediamkt](https://avatars.discourse-cdn.com/v4/letter/m/e9c0ed/32.png) [@multimediamkt](https://forum.kirupa.com/u/multimediamkt)\
**Post date:** [February 23, 2012, 2:59pm UTC](https://forum.kirupa.com/t/is-there-a-way-to-add-more-items-on-this-nav-bar/327350/1 "2012-02-23T14:59:47Z")

</div>

How do I add more items so that to workaround the trouble of overflow on the navbar :  
if more items are added the navbar expands in height and the new items are place on another line messing the layout. The nav items are too spaced , is there a way to decrease the spacing so that I can fit 2 or 3 more nav items :?

> 

…  
\<nav\>

\<ul\>  
\<li class=“selected”\>\<a href=“#”\>Blog\</a\>\</li\>  
\<li\>\<a href=“#”\>About\</a\>\</li\>  
\<li\>\<a href=“#”\>Archives\</a\>\</li\>  
\<li\>\<a href=“#”\>Contact\</a\>\</li\>

\</ul\>  
\</nav\>

…

header, footer, section, aside, nav, article {  
display: block;  
}

body {  
margin: 0 auto;  
padding: 22px 0;  
width: 940px;  
font: 13px/22px Helvetica, Arial, sans-serif;  
background: #F0F0F0;  
}

h1, h2 {  
font-size: 28px;  
line-height: 44px;  
padding: 22px 0;  
}

h3 {  
font-size: 18px;  
line-height: 22px;  
padding: 11px 0;  
}

p {  
padding-bottom: 22px;  
}

/_------------------------------  
N A V I G A T I O N  
------------------------------_/

nav {  
position: absolute;  
left: 0;  
width: 100%;  
background: url(“…/images/nav\_background.jpg”);  
}

```
nav ul {
	margin: 0 auto;
	width: 940px;
	list-style: none;
}

	nav ul li {
		float: left;
	}
	
		nav ul li a {
			display: block;
			margin-right: 20px;
			width: 140px;
			font-size: 14px;
			line-height: 44px;
			text-align: center;
			text-decoration: none;
			color: #777;
		}
		
			nav ul li a:hover {
				color: #fff;
			}
		
		nav ul li.selected a {
			color: #fff;
		}
		
		nav ul li.subscribe a {
			margin-left: 22px;
			padding-left: 33px;
			text-align: left;
			background: url("../images/rss.png") left center no-repeat;
		}

```