Javascript: Obtenir la largeur des éléments enfants

Question

J'ai deux divs empilés.

La div externe a une largeur fixe avec le débordement caché.

Le div interne a un contenu qui peut être plus grand que le div précédent.

Comment puis-je obtenir la largeur totale du contenu de la div interne?

<div id='outer' style='width:100px'> 
    <div id='inner'> 
     content 
    </div> 
</div> 

Lorsque je tente $ (« # intérieure ») largeur.() et le contenu est plus grand que externe, elle retourne la largeur de la div externe.

J'utilise Chrome.

http://jsfiddle.net/4syEJ/

Answer 1

Vous pouvez obtenir le .scrollWidth du parent, qui retournera ce que vous voulez.

document.getElementById('outer').scrollWidth

http://jsfiddle.net/4syEJ/3/

Answer 2

Essayez:

<div id="outer" style="width:100px"> 
    <div id="inner"> 
     <p id="content">content</p> 
    </div> 
</div> 

Et

$('#content').width(); 

Answer 3

vous pouvez utiliser .children() sélecteur de jquery comme ceci:

$('#info').html($('#box1').children().width(); 
$('#box2').children().width(); 
$('#box3').width()); 

http://jsfiddle.net/4syEJ/2/