Spry horizontal menu goes vertical in IE6

Question

My site is still incomplete but I was testing the basic
layout on different browsers, and found that my horizontal Spry
menu bar at the bottom of the page goes vertical in IE6 (but not in
any other browser I tested). Any thoughts why this could be? The
page is
here.
On an unrelated note, the left sidebar does not reach all the
way to the footer in any browser that is not IE. 90% of my traffic
is from people using IE, but I'd like to fix it if possible. I
tried using a javascript workaround to making equal length columns
with CSS that I found on these forums, but could not get it to work
right across all browsers, so decided to just make fixed-length
side columns instead. Any help on either problem would be
appreciated!!

Answer 1

Have a look at the following piece of code in your modified CSS file
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
    filter:alpha(opacity:0.1);
    background-color: #000;
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
    ul.MenuBarHorizontal li.MenuBarItemIE
    display: inline;
    f\loat: none;
    background-color: #F00;
You have changed the latter two highlighted lines, which you must have done because you felt that you are an expert.
Sorry to disappoint, because the last highlighted line is where the problem lies. If you replace the f/loat value back to the original left, your problem will have disappeared.
Gramps