Debordement sur le Floating

12 décembre 2005 à 20:12:02

Salut !
j'ai un probleme , je fait un petit skin pour un site qui ca fonctionner sur Python Karrigell
mais j'ai un probleme , j'ai fait le menu en floating , mais il depasse completement du corp
voila la source html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Kedare's Web !</title>
<link rel="stylesheet" media="screen" type="text/css" title="CSS principal" href="main.css" />
</head>
<body>
<div class="main">
<div class="head">Kedare's Web !</div>
<div class="corp">
<div class="menu">Voila le menu !</br>

encore une fois<br/>
puis encore ...</div>
<div class="contenue">

Youhou !!
</div>
</div>
</div>
</body>
</html>

le CSS :

.main { margin-left: 5%;
margin-right: 5%;
width: 90%;
}

.head { border-width: 1px;
height: 15px;
font-family: Arial,Helvetica,sans-serif;
font-size: 0.8em;
font-weight: bold;
border-top-style: dashed;
border-left-style: dashed;
border-right-style: dashed;
background-color: rgb(255, 241, 214);
text-align: left;
padding-left: 10px;
}

.corp { border-width: 1px;
background-color: rgb(255, 204, 102);
opacity: 1;
border-right-style: dashed;
border-bottom-style: dashed;
border-left-style: dashed;
}

.menu { float: left;
border-right-style: dotted;
border-right-width: 1px;
width: 20%;
color: rgb(52, 54, 116);
font-size: 0.8em;
}

.contenue { font-family: Arial,Helvetica,sans-serif;
color: rgb(39, 122, 45);
font-size: 0.8em;
width: 80%;
margin-left: 21%;
margin-right: 1%;
margin-bottom: 5px;
}

essayez vous meme vous allez voir

je voudrais que le menu ne puisse pas sortire par le bas de corp , mais que le corp vienne avec lui
Voila j'espere que vous pourrez m'aider

gcyrillus

13 décembre 2005 à 0:10:02

bonjour,
il te faut ajouter en dernier dans corp (ou apres corp ou contenu) un nouvel element, genre div avec pour css clear:both;
(d'ou l'interet ou l'apparition des pied de pages sur de nombreuses pages

)
a plus

fan de pluxml je suis cuisinier et codeur amateur. Des thèmes pour pluxml ? Oui

jp949

13 décembre 2005 à 6:02:55

Salut.
Il faut mettre le div #menu avant le #corps dans le code html. Les flottants se placent avant les cadres qu'ils entourent

sup3rhero

13 décembre 2005 à 9:29:39

Raphael

13 décembre 2005 à 11:18:29

Hello, à vue d'oeil, tu devrais avoir tout ce qu'il te faut ici :
http://forum.alsacreations.com/faq/#item6

gcyrillus

13 décembre 2005 à 11:26:55

?? l'important n'est pas de savoir si il doit utiliser corp comme conteneur du menu et contenu ou non, le souci c'est de savoir pourquoi un element flottant n'etire pas son conteneur (sauf dans IE).

Donc sous les navigateur autre que IE, pour etirer un element contenant un ou plusieurs element flottant, un element/une balise placé apres les flottant dans le flux et avec l'attributs css "clear" permet justement d'etirer ce "conteneur".

Ce probleme est recurant sur les forum. j'avais au mois de juin fait 2 petite page a voir sous IE et un autre navigateur, a propos de ces flottants, clear et eventuellemnt le "piege" a debutant de l'usage du clear.
une image en float a cote de son texte dans un coteneur qui devrait s'etirer. et l'autre page :la meme mais avec un des flottants supplementaires , genant l'usage du clear.
a plus

edit

Citation : jp949

J'insiste .
la premiere regle pour les flottants avant de mettre des clear ,c'est de placer le flottant dans le code html avant l'eement qui le cotoie

tout a fait d'accord, mais c'est deja ce qu'il fait ! le menu puis le contenu, le corp est le conteneur de ces 2 elements. A ne pas bien lire ou analyser les probleme des autres et lacher des post ou remarque inutile, ça devient du flood sans interet, et ça rend la lecture du topic difficile pour celui qui a un probleme a regler.

On dit tous des aneries a un moment ou un autre, et il est pas toujours evident de rester dans le sujet, moi le premier. :-°

a pluche !

fan de pluxml je suis cuisinier et codeur amateur. Des thèmes pour pluxml ? Oui

jp949

13 décembre 2005 à 12:35:14

J'insiste .
la premiere regle pour les flottants avant de mettre des clear ,c'est de placer le flottant dans le code html avant l'eement qui le cotoie