css: Hauteur d'1 div container contenant une div float:left

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par nickargall, 12 Décembre 2006.

  1. nickargall
    nickargall WRInaute accro
    Inscrit:
    13 Juin 2005
    Messages:
    6 601
    J'aime reçus:
    4
    Bonjour

    débutant en CSS, j'ai un pb de hauteur de div.
    mon .container inclut deux div , .bloc_gauche (float:left;) et .bloc_droite (float:right;)
    J'aimerais que la hauteur de mon .container s'adapte à la hauteur occuppée par les deux div qu'il contient. Donc ne pas lui assigner de hauteur fixe.

    Je sèche, qqun peut m'aider ? Avec mon code ci dessous


    Code:
    .container
    {
    background-color: #EDEDED;
    padding:5px;
    border:1px solid #333;
    }
    .bloc_gauche{
    width:76%;
    float:left;
    }
    .bloc_droite{
    width:22%;
    float:right;
    }
    
    
    Code:
    <div class="container">
       <div class="bloc_droite">blablablablabalabl balbalabl abl</div>
       <div class="bloc_gauche">plo plo plo ploo ploplo polp plo</div>
    </div>
    
    merci
     
  2. biddybulle
    biddybulle WRInaute passionné
    Inscrit:
    30 Mai 2005
    Messages:
    1 428
    J'aime reçus:
    0
    t as réellement besoin du container ?
    parce que tes balises float les font sortir de celui-ci et si tu les enléves tu ne peux pas dans ce cas positionner côte à côte tes deux blocs.

    enfin casse tête mais quelqu un va trouver.
     
  3. narayana
    narayana WRInaute impliqué
    Inscrit:
    28 Janvier 2005
    Messages:
    727
    J'aime reçus:
    0
    Salut il faut que tu fasses un clear de tes flotants pour revenir dans le flux normal de ta page.
    Soit en code et ceci juste avant la fin du div container
    Code:
    <div style="clear:both;"></div>
    
    Sinon tu peux jeter un oeil ici
     
  4. metropoway
    metropoway WRInaute discret
    Inscrit:
    3 Mars 2004
    Messages:
    219
    J'aime reçus:
    1
    C'est effectivement un - gros - casse - tête que je n'ai pas encore réussi à résoudre correctement. :?
    Je n'ai trouvé que des solutions bancales en utilisant les min-height par exemple pour limiter les dégats éventuels.

    Sinon, régulièrement je me pose la question... en vain. :cry:
    Je suis donc également preneur de toute solution 'élégante' qui pourra être proposée. :D
     
  5. biddybulle
    biddybulle WRInaute passionné
    Inscrit:
    30 Mai 2005
    Messages:
    1 428
    J'aime reçus:
    0
    super ta soluce narayana.

    Merci
     
  6. nickargall
    nickargall WRInaute accro
    Inscrit:
    13 Juin 2005
    Messages:
    6 601
    J'aime reçus:
    4
    Great :) super, merci :)

    edit :
    Mince Bon du coup j'ai une div super-super container qui me refait la même chose, et seulement sur IE7. Bon va falloir trouver maintenant :)
     
  7. narayana
    narayana WRInaute impliqué
    Inscrit:
    28 Janvier 2005
    Messages:
    727
    J'aime reçus:
    0
  8. nickargall
    nickargall WRInaute accro
    Inscrit:
    13 Juin 2005
    Messages:
    6 601
    J'aime reçus:
    4
    En MP :) je te l'envoie :) merci :)
     
  9. narayana
    narayana WRInaute impliqué
    Inscrit:
    28 Janvier 2005
    Messages:
    727
    J'aime reçus:
    0
Chargement...
Similar Threads - css Hauteur div Forum Date
[HTML & CSS] div centrés en hauteur ? Administration d'un site Web 6 Février 2005
css : hauteur de page variable Développement d'un site Web ou d'une appli mobile 29 Septembre 2009
Donner une hauteur relative à un float en css Développement d'un site Web ou d'une appli mobile 4 Juin 2007
pb de CSS Développement d'un site Web ou d'une appli mobile 10 Mai 2022
Unused CSS et outils pour supprimer feuilles de style inutilisées Développement d'un site Web ou d'une appli mobile 27 Avril 2022
CSS / Attribuer 2 couleurs différentes aux H2 Développement d'un site Web ou d'une appli mobile 12 Mars 2022
Perplexité : pourquoi utiliser une classe CSS en dehors de <body> Développement d'un site Web ou d'une appli mobile 26 Décembre 2021
<noscript><link ...> du css après un <link rel="preload"... Débuter en référencement 1 Mai 2021
Utiliser une grille CSS peut-il nuire au référencement ? Débuter en référencement 17 Janvier 2021
[CSS] Application (non souhaitée) d'un effet au parent via :not(:hover) Développement d'un site Web ou d'une appli mobile 17 Novembre 2020
WordPress Suppression élément avec Css Demandes d'avis et de conseils sur vos sites 16 Août 2020
Conflit image responsive et animation css Développement d'un site Web ou d'une appli mobile 20 Février 2020
Ajouter une Opacité CSS sur une image en Background Développement d'un site Web ou d'une appli mobile 4 Février 2020
CSS Google Shopping AdWords 23 Janvier 2020
style.css unique préférable avec link ou javascript ? Développement d'un site Web ou d'une appli mobile 25 Décembre 2019
Comment gérer le ALT d'une image en CSS background-image YouTube, Google Images et Google Maps 17 Décembre 2019
Contenu mixte vers http / css - réelle gravité ? Débuter en référencement 24 Septembre 2019
Extension Chrome utile pour afficher le code source HTML, JS, CSS Développement d'un site Web ou d'une appli mobile 5 Juillet 2019
css pour cookieconsent et apparence graphique. Développement d'un site Web ou d'une appli mobile 28 Avril 2019
Appliquer style CSS CMS GHOST Développement d'un site Web ou d'une appli mobile 21 Mars 2019