Owiee1331
Owiee1331

Reputation: 53

One li is not on the same line as the other?

I got a problem with my menu. The last li element is not on the same line as the others. The last li contains a div, the other 3 contains anchor tags.
I mean, it's basically on the same line, but the last looks like it's having a margin-top: 1px or something. But it don't have that.

Upvotes: 1

Views: 489

Answers (1)

EaziLuizi
EaziLuizi

Reputation: 1615

Without more code this can be difficult, but from the image link you provided here is the code to achieve you required output:

        ul {
            list-style: none;
        }
        /*This is probably what was causing your miss-alignment*/
            ul li {
                display: inline-block;
                border: 1px solid #808080;
                border-radius:5px;
                padding: 10px 50px;
            }
    <div>
        <ul>
            <li><a>a1</a></li>
            <li><a>a2</a></li>
            <li><a>a3</a></li>
            <li><div>div</div></li>
        </ul>
    </div>

Another possibility is that you are adding margin to all div or same-class elements by mistake.

Upvotes: 1

Related Questions