Comment peut donner div troisième enfant dans un parent div

Question

J'ai un div div. Le sommet de la div Parent contient deux divs enfants. Comment puis-je donner troisième enfant div en dessous du premier enfant div

<div class=parent1> 
    <div class=child1>some text</div> /*this is in top left of the parent div */ 
    <div class=child2>some text</div> /*this is in top right of the parent div */ 
    <div class=child3>some text</div> /*how can i write css for this div come as left bottom*/ 

Answer 1

Utilisation du flotteurcss fonctionnera si vous êtes prêt à attribuer une largeur fixe à vos DIV.

<style> 
    div.parent1 { 
    width: 800px; 
    } 

    .child1 { 
    float: left; 
    width: 400px; 
    } 

    .child2 { 
    float: right 
    width: 400px; 
    } 

    .child3-container { 
    clear:both; 
    text-align: right; 
    } 

</style> 

<div class=parent1> 
    <div class=child1>some text</div> 
    <div class=child2>some text</div> 
    <div class='child3-container' > 
    <div class=child3>some text</div> 
    </div> 
</div> 

Answer 2

Vous pouvez mettre jQuery à utiliser pour faire le travail facilement. Utilisez le eq() sélecteur de jquery pour vous obtenir le div désiré:

$('div#parent div:eq(1)'); // gets second div inside a div with id parent 

Comment puis-je donner troisième enfant div ci-dessous le premier enfant div

Si je vous reçois, vous voulez pour ajouter un autre div après le premier enfant div, vous pouvez utiliser à nouveau eq et after sélecteur pour cela:

$('div#parent div:eq(0)').after('<div>Some Content</div>'); 

Mise à jour:

Here is the demo I created for that

L'idée est que div parent doit être placé relative et de l'enfant divs absolute, puis en utilisant top, left, width et height propriétés.