Voir le sujet précédent :: Voir le sujet suivant |
Auteur |
Message |
basti frontpage mioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 13:39 |
|
|
Mes colonnes gauche et droite qui sont respectivement positionner en float:left et float:right dans en un contenu ne veulent pas s'adapter en hauteur et on observe donc un depassement comme vous pouvez l'apercevoir sur l'image si dessous :
le bloque test aura une taille variable donc la taille totale du site ne peut pas etre determiner d'avance d'ou la propriété height:100%
Je narrive vas a regler se probleme merci davance pour votre aide
Code: |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>gauche droite fluide</title>
<style type="text/css">
<!--
html, body {
margin: 0;
background-color: #fff; /*couleur de fond blanche*/
height: 100%;
}
.conteneur {
width: 800px;
background-color: green;
height: 100%;
}
.gauche {
float: left;
width: 160px;
height: 100%;
background-color: yellow;;
}
.droite {
float: right;
width: 160px;
height: 100%;
background-color: yellow;
}
.test {
float: left;
width: 480px;
height: 150px;;
background-color:#cccccc;
margin-top:5px;
}
-->
</style>
</head>
<body>
<div class="conteneur">
<div class="gauche">partie gauche</div>
<div class="droite">partie droite</div>
<div class="test">test</div>
<div class="test">test</div>
<div class="test">test</div>
<div class="test">test</div>
</div>
</body>
</html>
|
|
|
|
rorschach dreamweaver mioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 16:32 |
|
|
tu souhaite que les partie jaune descendent jusqu'en bas de la page ? c'est déjà le cas chez moi sur IE et mozilla... ou alors j'ai pas compris ton problème ! |
|
|
basti frontpage mioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 17:29 |
|
|
oui je souhaite que les colonnes jaune descends jusque en bas mais dans l'exemple jai pas mis assez de bloque test ,rajoutes en une dizaine et tu verras le debordement. |
|
|
rorschach dreamweaver mioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 17:40 |
|
|
la solution que je connaisse est celle de Dan Cederholm mais comme je ne sais pas à quoi devra ressembler le look de ton site je sais pas si ça va t'aider, enfin c'est ici : Faux Columns [http://www.alistapart.com/articles/fauxcolumns/]
l'astuce consiste à utiliser une image en fond de page, comme l'image remplit toute la page on simule des colonnes qui descende jusqu'en bas de la page, c'est la méthode que j'ai choisi pour mon futur site : Mon site en construction [http://lfdlc.free.fr/] |
|
|
basti frontpage mioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 18:45 |
|
|
voici mon site en préparation: http://hero.clix.free.fr/hc/ [http://hero.clix.free.fr/hc/]
Tu remarqueras les débordements a la 3eme news dans ce cas si j'ai fixé mes colonnes a 1000px. (mais si je mets en pourentage cest pire)
et voici mon ancien fait avec des tableau (la c'est pour la pub)
http://hero.clix.free.fr [http://hero.clix.free.fr]
j'avoue ne pas comprendre la technique du site que tu mas proposé mais je vais me concentrer dessus ca a l'aire de répondre a mon probleme.(désolé je suis pas tres fort en anglais) |
|
|
rorschach dreamweaver mioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 19:51 |
|
|
la technique des "faux columns" est simple tu fait une image de ton fond comme ça :
http://membres.lycos.fr/lfdlc/images/fond.gif [http://membres.lycos.fr/lfdlc/images/fond.gif]
et ensuite dans ta feuille de style tu change ça :
Code: |
html, body {
margin: 0;
padding-bottom:25px;
background-color: #fff; /*couleur de fond blanche*/
scrollbar-face-color: #000000; /* couleur barre */
scrollbar-arrow-color: #ffffff; /* couleur fleche */
scrollbar-track-color: #eeeeee; /* couleur fond */
scrollbar-3dlight-color: #000000; /* couleur effet 3D */
scrollbar-darkshadow-color: #000000; /* couleur */
scrollbar-shadow-color: #ffffff; /* couleur */
scrollbar-highlight-color: #ffffff;
height: 100%;
}
|
en ça :
Code: |
html, body {
margin: 0;
padding-bottom:25px;
background-color: #fff; /*couleur de fond blanche*/
scrollbar-face-color: #000000; /* couleur barre */
scrollbar-arrow-color: #ffffff; /* couleur fleche */
scrollbar-track-color: #eeeeee; /* couleur fond */
scrollbar-3dlight-color: #000000; /* couleur effet 3D */
scrollbar-darkshadow-color: #000000; /* couleur */
scrollbar-shadow-color: #ffffff; /* couleur */
scrollbar-highlight-color: #ffffff;
height: 100%;
background-image: url(images/fond.gif);
background-position : center ;
background-repeat : repeat-y ;
}
|
ainsi ton fond se repete jusqu'en bas de la page ... |
|
|
basti frontpage mioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 20:30 |
|
|
En effet ca marche je te remercie beauoup pour ton aide. En tout c'est une belle astuce.
http://hero.clix.free.fr/hc/ [http://hero.clix.free.fr/hc/] |
|
|
Génius flashmioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 20:57 |
|
|
Mince j'arrive trop tard pour la sucette
Il la vouler RORSHACH...
Jolie site moi j'adore les marvels les stranges et tous... |
|
|
basti frontpage mioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 22:50 |
|
|
merci.
Mais un problème n'arrive jamais sans un autre c'est bien connu.
J'ai observé sous Netscape un décalage de l'image de fond et de mon interface (une rainure noir apparait)
Si je modifier la position du conteneur le probleme s'inverse et c'est sous Internet Exploreur qu'apparait l'erreur.
Arg !! je suis coincé.
Je fait donc encore une fois appelle a vous semi dieux que vous etes.
http://hero.clix.free.fr/hc/ [http://hero.clix.free.fr/hc/] |
|
|
rorschach dreamweaver mioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 23:07 |
|
|
un décalage du fond par rapport au bloc que tu as définit... je connais ça, jusqu'ici j'ai pas trouver de solution, c'est en fait à cause de Internet explorer qui ne semble pas gerer le centrage d'une image de fond de la même facon qu'il centre un bloc css, ce qui à pour conséquence de faire apparaitre un décalage d'un pixel ou non suivant la taille de la fenetre du navigateur, faut essayer de déplacer le décalage sur le bas de la page là ou ça se voit po..
si tu regarde cette url : http://www.simplebits.com/contact/ [http://www.simplebits.com/contact/] avec IE tu remarquera le même problème ce qui me laisse penser que même le grand Dan Cederholm n'a pas la solution ...
par contre sous Mozilla ou Firefox ce problème n'existe pas, voilà une raison de plus de laisser IE et de passer à mozilla ou firefox |
|
|
basti frontpage mioche
|
Une sucette comme recompense a celle ou celui qui m'aidera , Posté le: 22-02-2004 23:24 |
|
|
Ah la la Microsoft ils font jamais comme les autres.
C'est donc un combat perdu d'avance sniff.
Bas je te remercie beaucoup pour m'avoir aider. |
|
|
|