CODEWITHSUNDEEP
cssborder
bharathi
bharathi

Reputation: 6271

draw a border equally for all ul in css

Can anyone guide me how to draw the border equally for all the ul list displayed. Here if u see the the border between the second and third ul list is not equal to the border between the first and second ul list.There is any way to draw a border equally based on the ul first list.

enter image description here

Upvotes: 0

Views: 100

Answers (3)

arthur
arthur

Reputation: 950

If the size of your list can change, you can set the height of your element in javascript. For example, using jquery you can do: 

$(document).ready(function() {
    var uls = $("ul")
    var max = 0;
    for (var i = 0, l = urls.length ; i < l ; i++) { 
        var height = $(uls[i]).height(); 
        if (height > max) { 
            max = height; 
        } 
    }
    uls.height(max);
});

Upvotes: 0

rmorse
rmorse

Reputation: 736

As above just make sure you set

display:block

on your ULs and give them a fixed height, otherwise you could wrap your ULs in a DIV and apply styling to that.

Upvotes: 0

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114347

You need to set the height of your ULs to be the same in your CSS declaration.

Upvotes: 2

Related Questions