Magento Navigation How To Keep on One Line

Question

This seems like something simple, but just not working for me. I'm trying to change my styles.css to have the navigation stay on one line. Here is the code I think is relevant.

/********** < Navigation */
.nav-container {clear: both; width:70%; float: left; margin: 10px 0px 10px  }
#nav { margin:0 auto; padding:0; font-size:13px; }

/* All Levels */ /* Style consistent throughout all nav levels */
#nav li { position:relative; text-align:left; }
#nav li.over { z-index:998; }
#nav a,
#nav a:hover { display:block; line-height:1.3em; text-decoration:none; }
#nav span { display:block; cursor:pointer; white-space:nowrap; }
#nav li ul span {white-space:normal; }
#nav ul li.parent a {}
#nav ul li.parent li a { background-image:none; }
#nav a.category span { background: url(../images/nav-category.gif) no-repeat center right; padding-right: 20px; }

/* 0 Level */
#nav li { float:left; }
#nav li.active a { color:#2882ce; }
#nav a { font-size: 115%; float:left; padding:5px 50px 5px 0px; color:#303030; }
#nav li.last a { padding-right: 0px !important;}
#nav li.over a,
#nav a:hover { color:#2882ce; }

/* 1st Level */
#nav ul li,
#nav ul li.active { float:none; margin:0; padding-bottom:1px; background:#ecf3f6; }
#nav ul li.last { background:#ecf3f6; padding-bottom:0; }

#nav ul a,
#nav ul a:hover { float:none; padding:0; background:none; }
#nav ul li a { font-size: 100% !important; font-weight:normal !important; }

/* 2nd Level */
#nav ul,
#nav div { position:absolute; width:15em; top:27px; left:-10000px; border:1px solid #899ba5; }
#nav div ul { position:static; width:auto; border:none; }

/* 3rd+ Level */
#nav ul ul,
#nav ul div { top:5px; }

#nav ul li a { background:#ecf3f6; }
#nav ul li a:hover { background:#d5e4eb; }
#nav ul li a,
#nav ul li a:hover { color:#2f2f2f !important; }
#nav ul span,
#nav ul li.last li span { padding:3px 15px 4px 15px; }

/* Show menu */
#nav li ul.shown-sub,
#nav li div.shown-sub { left:0; z-index:999; }
#nav li .shown-sub ul.shown-sub,
#nav li .shown-sub li div.shown-sub { left:100px; }
/********** Navigation > */

Answer 1

Was able to fix my problem, tried multiple things like dispay: (table,inline,block-line, etc..) I also changed the width to 100% as opposed to 70%. What fixed the problem was

.nav-container {clear: both; width:1800px

I just changed the width size to px instead of using %, fixed the problem :). Just adding a answer just in case anyone else has the same issue.