display:inline vs. float:left

[rxaviers]

Doesn't float:left requires a non inline layout?

jquery-wp-content/themes/jquery/css/base.css

Line 1348 in e11b887

display: inline;

For history track purposes, this change has been inserted by e11b887.

[rxaviers]

If so, I suggest the following change:

@@ -1350,7 +1350,6 @@ nav#main ul {
 }

 nav#main li {
-       display: inline;
        float: left;
        font: normal normal 16px "klavika-web", "Helvetica Neue", Helvetica, Ari
        margin-right: 2px;

[rxaviers]

Mozilla CSS float reference says:

As float implicitly implies the use of the block layout, it modifies the computed value of the display values in some cases:

[JonathanThiyagarajan]

The purpose of inline is just to display everything in a one single line.
The purpose of float is to arrange ELEMENTS aligning to some desired dimension.

[scottgonzalez]

I'm not sure why we're using display: inline for the nav. All the <li>s are just text anyway.

[JonathanThiyagarajan]

To force the list into one line, we need to apply "display: inline;" to the "LI" or

.

[jenstrickland]

We have a choice of removing display:inline, and it works fine, or changing it to display:inline-block, removing float:left, and adding zoom:1. Either solution works. Removing display:inline is the least problematic.

[scottgonzalez]

Thanks @jenstrickland. Do you want to sign our CLA and send a pull request for that?

[kswedberg]

Not sure why display: inline was put in there, but there was an old IE bug that doubled the left margin if the element was floated left unless it also had display: inline. Still, that bug doesn't even apply here, since the float is on the left and the margin is on the right.

[scottgonzalez]

Fixed in d79ac12.