2 div à 100 % fonctione + ou -
Bonjour,
j'ai mis
un html et body à 100%
et un cadre jaune qui fat 100 % du navigateur donc ca fonctionne tres bien
j'ai rajoute des mot qui sera remplacer par un menu haut
en sous des mots j'ai rajouté un cadre rouge
comme cette exemple
https://fiddle.jshell.net/3g7smjd2/1/
le cadre rouge j'ai mis à 100% mais il dépasse sur le 1 er cadre jaune
comment lui dir de mettre le cadre rouge à 100% sans qu'il dépasse le 1 er cadre div
j'ai mis
un html et body à 100%
et un cadre jaune qui fat 100 % du navigateur donc ca fonctionne tres bien
j'ai rajoute des mot qui sera remplacer par un menu haut
en sous des mots j'ai rajouté un cadre rouge
comme cette exemple
https://fiddle.jshell.net/3g7smjd2/1/
le cadre rouge j'ai mis à 100% mais il dépasse sur le 1 er cadre jaune
comment lui dir de mettre le cadre rouge à 100% sans qu'il dépasse le 1 er cadre div
2 réponses
-
Bonjour,
Pouvez-vous donner votre script html et vos css ? -
voilà
<!doctype html> <html lang="fr"> <head> <meta charset="utf-8"> <title>Document sans titre</title> <link rel="stylesheet" type="text/css" href="../../design/Basic/pardefault.css"> </head> <body> <!--Début mini chat--> <!--cette class mini chat et à 100%--> <section class="mini-chat"> <!---Début menu haut--> <nav><ol class="menu-horizon-mini-chat"> <li class="icon-minichatfichier" title="Fichier"><a href="../module/portail.php" rel="nofollow" target="_blank" title="Fichier">Fichier</a></li> <li class="icon-minichatcontact" title="Contacts"><a href="../module/forum/index.php" rel="nofollow" target="_blank" title="Contacts">Contacts</a></li> <li class="icon-minichataction" title="Actions"><a href="../module/inscription/index.php" rel="nofollow" target="_blank" title="Actions">Actions</a></li> <li class="icon-minichatoutil" title="Outils"><a href="../module/inscription/index.php" rel="nofollow" target="_blank" title="Outils">Outils</a></li> <li class="icon-minichatversion" title="Version : 1.2"><a href="../module/rechercher/index.php" rel="nofollow" target="_blank" title="Version : 1.2">Version : 1.2</a></li> </ol></nav> <!---Fin menu haut--> <!--cette class mini-chat-salon-officielle-perso je veux qu'il soit à 100% qu'il s'arrete en bas du cadre mini chat hors llà il dépasse le cadre mini chat--> <div class="mini-chat-salon-officielle-perso"></div> </section> <!--Fin mini chat--> </body> </html>
/*********************************************************************************************************Début mini chat****************************************************************************************************************************************/ html,body { height:100%; } .mini-chat { height:100%; border:#CCCCCC solid 1px; } ol.menu-horizon-mini-chat li { border-right:1px solid #CCCCCC; position: relative; float: left; display: block; color: #D8D7D7; height:2em; line-height:2em; padding-left:1em; padding-right:1em; } .menu-horizon-mini-chat { /* background-color:#68869a;*/ /* background:linear-gradient(to bottom, #68869a 0%,#5a7f97 100%);*/ height:2em; padding-left:0em; border-bottom:1px solid #CCCCCC; margin:0em; } olmenu-horizon-mini-chat li a { padding:1em; } /*************************début menu mini chat horizontal************************************************/ .galerie-salon-officielle li { float: left; border:#CCCCCC 1px solid; margin:1em; width: 20em; /* 100%/3 = 3 colonnes */ } .galerie-salon-officielle li p { border-top:#CCCCCC 1px solid; } /*************************Fin menu mini chat horizontal**************************************************/ /*************************Début Des menu salon officielles et perso***********************************************/ .mini-chat-salon-officielle-perso { height:97.2%; overflow-y:scroll; background-color:#006633; font-size:0.8em; font-weight:700; } /*************************Fin Des menu salon officielles et perso*************************************************/
