help with clearing a float left

0
votes

I have an unordered floated left that uses css hover menu. However, it's not clearing the next unordered list after it. I've tried clear: both but it doesn't work. Any suggestions?

i tried using overflow auto on the div tag before, but that creates scrollbars.

The url is at: http://www.nvcc.edu/current-students/_militarydev/research/doctoral.html

i got it working using clearfix:after. how viable a solution is clearfix:after?

ul.topnav li ul.subnav { list-style: none; position: absolute; /--Important - Keeps subnav from affecting main navigation flow--/ left: 0; top: 35px; margin: 0; padding: 0; display: none; float: left; width: 190px; height: 350px; }

1
htmlcss
You might want to make it easier to find where the problem is. Looking at that page I see no immediately obvious problem which makes it very hard to help. There is also a good site called jsfiddle.net whcih you can use to give us cutdown versions of the problem you are having. You might even find that in trying to cut it down to a simpler form that you actually solve your own problem too. :) - Chris
Which browser is causing the issue? I'm not seeing anything wrong either. - Michelle
i got it working using clearfix:after. Thanks though! - steve
How can I get the subnav to have greater padding? I'm trying to to add it to the <ul> rather than li but it's not showing up.ul.topnav li ul.subnav { list-style: none; position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/ left: 0; top: 35px; margin: 0; padding: 0; display: none; float: left; width: 190px; height: 350px; } - steve

1 Answers

1
votes

Clearfix is one of the better ways to do this you can read up on it here if you want. Aside from that you're probably safe if it looks like you want it in all browsers you need it to support.

Clearfix is good in most cases.

It is used and recommended by a lot of front-end professionals, look at html5 boilerplate which offers it as a standard style in their standard stylesheet.