Question

how can I change width with Jquery of a DIV container when another DIV is loaded inside (via PHP)?

This is my HTML code

<div id="container">
    <div class="item"> Content 1 </div>
</div>

Now, I have a to populate dinamically the “container” for each page.
Another page may have this HTML code

<div id="container">
     <div class="item"> Content 1 </div>
     <div class="item"> Content 2 </div>
     <div class="item"> Content 3 </div>
</div>

“item” has float:left;
I want all “items” in a row. How can I change the “container” width dynamically when a “item” is loaded inside?

I’m using a scrollbar Jquery plugin to scroll divs.

Please, help!

Answer 1

do you need something like this ?

$(document).ready(function(){
    var youtWidth = 100;
    $('#container').width($('#container .item').length * yourWidth);
})

This count the elements inside the #container and set #container width to a multiple of the number of elements. In this example i keep 100px for each element.

Fabio