pb mise en page CSS

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : pb mise en page CSS

cooltwan

cible : firefox / IE 5.5 et >

but : faire la mise en page suivante

div 1 : hauteur en px fixe, collé en haut, largeur 100%

div 2 : hauteur laissé libre par div1 et div 3, largeur 100% (overflow hidden si pas assez d'espace dedans pour le contenu) et collé en haut et en bas aux 2 autres divs sans recouvrement

div 3 : hauteur en px fixe, collé en haut, largeur 100%

tentative : code ci dessous mais ca merde (lors du resize y a des chevauchement du div3)

Code :

<html>
<title>hello world</title>
<body>
<div style=" margin-top:20px;margin-bottom:20px;background-color:red; overflow:auto">test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test
</div>
<div style=" heigth:20px;background-color:blue;position:absolute;top:0px;">haut</div>
<div style=" heigth:20px;background-color:blue;position:absolute;bottom:0px;">haut</div>
</body>
</html>

Message édité par cooltwan le 14-09-2005 à 11:23:10

Publicité

FlorentG

C'est le genre de trucs hyper-relou à faire pour IE. Pour FireFox et les autres, c'est culcul...

De plus, ce genre de mise en page en elle-même est pas super Si t'as un petit écran, bah la div2 sera tout petite, ce qui peut poser des problèmes de lecture. Vaut mieux la laisser s'agrandir...

cooltwan

sous firefox c'est vite expedié comme ça

"


<html>
<title>hello world</title>

<body>
<div style=" position:absolute;top:20px;bottom:20px;background-color:red; overflow:auto">test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test
</div>
<div style=" heigth:20px;background-color:blue;position:absolute;top:0px;">haut</div>
<div style=" heigth:20px;background-color:blue;position:absolute;bottom:0px;">haut</div>
</body>

</html>
"

mais la combinaison d'un top et bottom pour ie passe pas pour la div du milieu

gatsusat

tu mets les 3 div sans faire aucun style biscornu

déjà on met des id sur les éléments et on les styles via les CSS

on ne met pas de styles inline de cette manière, sinon ca sert à rien les CSS

Message cité 1 fois

cooltwan

gatsusat a écrit :

c'est crado mais là c'est que pour tester/bidouiller

FORUM HardWare.fr

Programmation

HTML/CSS

pb mise en page CSS

Sujets relatifs
CSS : quelle solution pour conserver mise en page avec layout ?	[CSS] mise en page d'un menu vertical : pb sous FF
[CSS] Mise en page	please, help pour mise en page CSS....
Vos Méthodes pour faire une intégration graphique et mise en Page CSS	mise en page CSS sous IE
Problème de mise en page avec CSS	CSS et mise en page
[Conseils]Mise en page contenant plein d'élément gif avec CSS ou HTML	mise en page css-->probleme son flash
Plus de sujets relatifs à : pb mise en page CSS

Page générée en 0.028 secondes