2 div à 100 % fonctione + ou -
sabine
-
sabine -
sabine -
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
A voir également:
- 2 div à 100 % fonctione + ou -
- Supercopier 2 - Télécharger - Gestion de fichiers
- Fonction si ou - Guide
- 2 ecran pc - Guide
- 100 mb en mo ✓ - Forum Matériel & Système
- 100 mo en go ✓ - Forum Mail
2 réponses
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*************************************************/
