Imbrication de DIV contenant un tableau

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par jer2701, 4 Août 2010.

  1. jer2701
    jer2701 WRInaute occasionnel
    Inscrit:
    2 Septembre 2005
    Messages:
    341
    J'aime reçus:
    0
    Bonjour,

    J'ai un problème avec une mise en page structurée de la manière suivante :

    je dispose d'une DIV principale
    Code:
    #page
    {
    	float:left;
    	height:100%;
    	width:100%;
    }
    
    Cette DIV comporte 2 DIV enfants qui coupent cette page principale en deux :
    Code:
    #colonne_gauche
    {
    	float:left;
    	margin:1%;
    	width:24%;
    }
    
    #colonne_droite
    {
    	float:left;
    	width:73%;
    }
    
    ma DIV #colonne_droite comporte un tableau relativement long.

    Mon problème est que ma DIV #colonne_droite et son tableau descendent plus bas que ma DIV #page (en passant par dessus).
    j'ai beau retourner le problème dans tous les sens je ne vois pas comment faire pour que ma DIV #page s'étende en hauteur en fonction de la longueur du tableau qui varie dynamiquement...
     
  2. spout
    spout WRInaute accro
    Inscrit:
    14 Mai 2003
    Messages:
    9 022
    J'aime reçus:
    291
    Sans exemple à voir c'est pas facile.
    A première vue je dirais que tu dois mettre un div clear:both après le div#page
     
  3. jer2701
    jer2701 WRInaute occasionnel
    Inscrit:
    2 Septembre 2005
    Messages:
    341
    J'aime reçus:
    0
    Je viens effectivement de trouver cette propriété qui malheureusement ne change rien au problème ...
    la propriété clear:both; pousse ma DIV #colonne_droite sous ma DIV #colonne gauche sans agrandir ma DIV #page
     
  4. spout
    spout WRInaute accro
    Inscrit:
    14 Mai 2003
    Messages:
    9 022
    J'aime reçus:
    291
    Comme je te disais, sans exemple (URL) c'est presque impossible de t'aider, on ne peut deviner le code HTML.
     
  5. Rod la Kox
    Rod la Kox WRInaute accro
    Inscrit:
    24 Juin 2008
    Messages:
    2 803
    J'aime reçus:
    0
    Mettre un overflow sur la div de gauche ?
     
  6. Zecat
    Zecat WRInaute accro
    Inscrit:
    1 Mars 2005
    Messages:
    9 176
    J'aime reçus:
    0
    Deja c'est sous quoi IE / FF ou chrome ? Parce que perso j'ai souvent des comportements radicalements différents avec les div entre IE/FF d'un coté et chrome qui souvent part en vrille ...
     
  7. blman
    blman WRInaute accro
    Inscrit:
    5 Septembre 2003
    Messages:
    2 740
    J'aime reçus:
    1
    Code:
    <div id="page">
    
    <div id="colonne_gauche"></div>
    <div id="colonne_droite"></div>
    <br clear="all"/>
    
    </div>

    OU


    Code:
    <div id="page">
    
    <div id="colonne_gauche"></div>
    <div id="colonne_droite"></div>
    <div style="clear:both;"></div>
    
    </div>
     
  8. anemone-clown
    anemone-clown WRInaute passionné
    Inscrit:
    11 Novembre 2007
    Messages:
    1 599
    J'aime reçus:
    20
    Tente de changer le 100% en auto :
    Code:
    #page{
    	float:left;
    	height:auto;
    	width:100%;
    }
    
    Et si ça ne va plus pour ta mise en page, ajoute
    Code:
      min-height:100%;
    
    En revanche, IE6 (voir 7) sera dans les choux...
     
  9. jer2701
    jer2701 WRInaute occasionnel
    Inscrit:
    2 Septembre 2005
    Messages:
    341
    J'aime reçus:
    0
    merci à tous, vous êtes très efficace :wink:

    c'est anemone-clown qui a trouvé la solution
    ma DIV #page avec son height:100% devait être en auto tout simplement.
    Quel casse-tête pour si peu !
    bravo et merci
     
Chargement...
Similar Threads - Imbrication DIV contenant Forum Date
Contenu non visible de l'internaute ( Tab Div) & SEO Rédaction web et référencement 23 Mars 2020
Ajouter style="display: block;" dans une div Développement d'un site Web ou d'une appli mobile 8 Janvier 2020
Masquer une div si Internet Explorer Développement d'un site Web ou d'une appli mobile 14 Décembre 2019
Liens de diversité : la langue VS le prix Référencement international (langues, pays) 30 Janvier 2019
Inclure une page dans un div avec la source visible pour SEO Développement d'un site Web ou d'une appli mobile 28 Novembre 2018
Site ralenti à cause d'Adsense : note Google Speed divisée par 2 AdSense 16 Novembre 2018
Menu de navigation, diversité des ancres de liens et SEO Référencement Google 24 Octobre 2018
Chute brutale des revenus Adsense (divisés par 3) AdSense 18 Octobre 2018
Quelle Raison Sociale pour Sites Divers? Droit du web (juridique, fiscalité...) 1 Octobre 2018
Divi, 404 à cause de leur JS Crawl et indexation Google, sitemaps 7 Février 2018
  1. Ce site utilise des cookies. En continuant à utiliser ce site, vous acceptez l'utilisation des cookies.
    Rejeter la notice