Question

I am trying to make my subnav list display horizontally rather than stacked. I have tried a few different things, but I cant figure it out. I have tried to use Float, but it messes with the width of the divs below it. Not sure why this happens.

Can anyone help me?

http://jsfiddle.net/9bued/1/

Answer 1

Delete the width limitation as Habib suggested, then add a clearfix class to the containing ul.

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }

/* Hides from IE-mac \*/ 
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

The styles for the clearfix should always go at the bottom of your style block or style sheet.