CODEWITHSUNDEEP
jqueryhtmlcss
trrrrrrm
trrrrrrm

Reputation: 11802

how to make the parent width equals the width of all element inside it?

my CSS code

.child{
    width:100px;
    height:100px;
    display:inline-block;
}

my HTML code

<div id="parent">
    <div class="child">
    </div>
    <div class="child">
    </div>
</div>

the .parent width will be 100%,but i want to make the parent width equals exactly the some of all childs, but i don't know how many child i will have and i don't know the width of each one

what is the easiest way to do that using CSS AND/OR Jquery ?

Upvotes: 0

Views: 2471

Answers (2)

BWelfel
BWelfel

Reputation: 532

$(document).ready(function(){
    var sumwidth=0;
    $("#parent").children().each(function() {
        var child = $(this);
        sumwidth+=child.width();
    });
    $("#parent").width(sumwidth);
});

Upvotes: 1

jeroen
jeroen

Reputation: 91734

You can float .parent or display it inline.

Upvotes: 2

Related Questions