2014-05-17 5 views
0

Je rencontre des difficultés pour déplacer une hauteur div de l'autre/être égale. J'ai besoin que ceux-ci soient égaux car la barre latérale gauche aura plus de contenu mais je voudrais toujours que la bonne hauteur de div bouge avec elle comme une barre latérale.Problème de déplacement d'une hauteur div égal/égal à l'autre

<div id="maincontainer"> 
    <div class="contentcontainer"> 

    <div class="postcontentcon">Nam eu auctor enim, id tincidunt dolor. Sed et lacinia sem. Donec pretium quam eget nunc vestibulum, vel sagittis nibh bibendum. Fusce eleifend sagittis ultrices. Nullam lobortis ultricies justo, nec tempus metus sollicitudin at. Proin sit amet turpis a orci ullamcorper pulvinar id vitae erat. Fusce sodales iaculis nulla ac faucibus. Vivamus blandit placerat nunc, nec dictum velit tincidunt in. Pellentesque elementum odio metus, eget fringilla nisi imperdiet quis. Etiam facilisis magna pellentesque lorem luctus condimentum. Nulla blandit ac ligula nec aliquam. Cras massa felis, condimentum condimentum ligula in, pharetra fermentum felis. Proin sed lorem interdum, lobortis lectus non, porta tortor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div> 

    <div class="postsidebarcon">Hello</div> 



</div> 

CSS

body { background-color:#606061; } 

.contentcontainer { 
margin:0 auto; 
position:relative; 
width: 1017px; 
height:auto; 
} 

.postcontentcon { 
margin:0 auto; 
position:relative; 
width: 694px; 
background-color:#525253; 
float:left; 
    } 

.postsidebarcon { 
margin:0 auto; 
position:relative; 
width: 323px; 
height:inherit; 
background-color:#484848; 
float:left; 
} 
+0

quelques conseils: faux-colonne, affichage: table/table-cellule, affichage: flex; clear ... –

Répondre

0

Vous avez quelques façons de faire son:

  1. display:flex et le dimensionnement de vos conteneurs, par défaut puisera enfant côte à côte demo
  2. display:table sur + parent width et display:table-cell; sur l'enfant + width: demo
  3. flotte compensation. float premier élément, mis en marge de seconde, ajouter un pseudo avec clear:both (ou left/right) demo
  4. technique colonne faux, oldish mais solide, bien ici depuis conteneur parent a un fixe width L'idée est de tirer le colonne sur background de parent:.. demo (ici j'ai utilisé un dégradé pour la démo, mais usally il est une image Vous pouvez utiliser nowdays plusieurs d'arrière-plan
  5. il y a d'autres manières délicates avec: flottant de & hauteurs de tamiser, la marge négative , débordement, certains utiliseront même le positionnement absolu, mais vous devriez ay loin d'utiliser ceux-ci.
+0

Merci beaucoup! – user3648353

+0

Je viens d'essayer le code, tout bien sauf pour le safari! il ne reçoit pas la mise en page, aucune suggestion? – user3648353

+0

@ user3648353 Quel exemple as-tu essayé en safari? –