Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
567 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  pb mise en page CSS

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

pb mise en page CSS

n°1199147
cooltwan
Posté le 14-09-2005 à 11:18:52  profilanswer
 

cible : firefox / IE 5.5 et >
 
but : faire la mise en page suivante
http://scenari.utc.fr/~anm/test.gif
 
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 :
  1. <html>
  2. <title>hello world</title>
  3. <body>
  4. <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
  5. </div>
  6. <div style=" heigth:20px;background-color:blue;position:absolute;top:0px;">haut</div>
  7. <div style=" heigth:20px;background-color:blue;position:absolute;bottom:0px;">haut</div>
  8. </body>
  9. </html>


Message édité par cooltwan le 14-09-2005 à 11:23:10
mood
Publicité
Posté le 14-09-2005 à 11:18:52  profilanswer
 

n°1199164
FlorentG
Unité de Masse
Posté le 14-09-2005 à 11:28:46  profilanswer
 

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...

n°1199173
cooltwan
Posté le 14-09-2005 à 11:34:54  profilanswer
 

sous firefox c'est vite expedié comme ça
 
"
<!-- basic template file for HTML -->
 
<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 :(

n°1199192
gatsusat
Posté le 14-09-2005 à 11:41:58  profilanswer
 

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

n°1199197
cooltwan
Posté le 14-09-2005 à 11:43:57  profilanswer
 

gatsusat a écrit :

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


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


Aller à :
Ajouter une réponse
  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 pageplease, help pour mise en page CSS....
Vos Méthodes pour faire une intégration graphique et mise en Page CSSmise en page CSS sous IE
Problème de mise en page avec CSSCSS et mise en page
[Conseils]Mise en page contenant plein d'élément gif avec CSS ou HTMLmise en page css-->probleme son flash
Plus de sujets relatifs à : pb mise en page CSS


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR