Question

Can I do this without Javascript?

Here is the mock markup..

<div id="parent">
 <div id="child1"> ... </div>
 <div id="child2"> ... </div>
</div>

I want the parent div to have a width of the least of its child div.

I my particular scenario I have a variable width image inside one of the div
I want the rest of divs to limit themselves to the width of the img div.

Answer 1

Based on the discussion in the comment: well you can always not show your main div until JS is done executing.
your markup will look as follows:

<div id="parent" style="diplay:none">
 <div class="child" style="width:100px"> ... </div>
 <div class="child" style="width:50px"> ... </div>
</div>​

Js Code:

var childELements=document.getElementsByClassName("child");
var minWidth=999999;
for(var i=0;i<childELements.length;i++)
{
var width=childELements[i].getWidth();
    if(width<minWidth)
    {
      minWidth=width;                    
    }
}

var parent=document.getElementById("parent");
parent.style.width=String(minWidth)+"px";
parent.style.display="block";

Live ​Demo

​