JFA
JFA

Reputation: 135

splitting ul into columns

I have a list of ul with 9 items, that I want to split into 2 columns. The first one to have the first 4 items and the second column to have the other 5 items.

I used this css

ul { -webkit-columns: 2;  -moz-columns: 2; columns: 2; }

HTML

<div class="footernav">
            <ul class="footer-lt">
                <li><a>Home</a></li>
                <li><a>Resort Overview</a></li>
                <li><a>Photo Gallery</a></li>
                <li><a>Contact Us</a></li>
                <li class="footertextcolor">Phone</li>
                <li>+000 60 275-737<li>
                <li class="footertextcolor">Address</li>
                <li>Armenia, Yerevan,</li>
                <li>G. Hovsepyan </li>
            </ul>
        </div>

but i get 5 items in the first column and 4 in the second. Is there a way I can specify where the break happens?

Upvotes: 0

Views: 456

Answers (1)

tylerism
tylerism

Reputation: 679

Honestly, you are probably better off making 2 ul tags. There does not seem to be a way to accomplish 2 unequal columns using that CSS property, unless of course you throw some blank li tags in there when needed.

Upvotes: 1

Related Questions