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

 
 


 Mot :   Pseudo :  
 
 Page :   1  2
Page Suivante
Page Précédente
Bas de page 
Auteur Sujet :

Centrer son site

n°496694
Le Castor
Neurasténique...
Posté le 25-08-2003 à 13:02:31  profilanswer
 

Reprise du message précédent :

Hermes le Messager a écrit :


PS : Si qqu trouve une possibilité pour rendre cette page fonctionnelle avec Moz, je lui envoie un carambar par courrier recommandé.  [:totozzz]  


 
Ca me donne envie d'essayer, chouette, un carambar  [:dark-imperator] !


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
mood
Publicité
Posté le 25-08-2003 à 13:02:31  profilanswer
 

n°496728
gm_superst​ar
Appelez-moi Super
Posté le 25-08-2003 à 13:27:22  profilanswer
 

Hermes le Messager a écrit :


PS : Si qqu trouve une possibilité pour rendre cette page fonctionnelle avec Moz, je lui envoie un carambar par courrier recommandé.  [:totozzz]


Ben avec Moz, on arrive à quelque chose d'équivalent avec 3 divs en position absolue, mais à ce moment là c'est IE qui marche plus parce qu'il ne reconnait pas les hauteurs et largeurs implicites déclarées comme ça :
 

div#milieu {
  position: absolute;
  top: 50px;
  bottom: 50px;
}


 
:/
 
Donc à moins de faire 2 pages différentes (une pour IE et une autre pour les vrais navigateurs) je vois pas trop de solution :/


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°496798
Le Castor
Neurasténique...
Posté le 25-08-2003 à 14:04:01  profilanswer
 

[:cid]  :D


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°496835
gm_superst​ar
Appelez-moi Super
Posté le 25-08-2003 à 14:20:13  profilanswer
 

Le Castor a écrit :

[:cid]  :D


Nan, cherche pas, y'a pas de solution universelle à ce problème ;)
 
Par contre c'est un bon exercice pour comprendre le fonctionnement du positionnement et les bugs de IE :D


Message édité par gm_superstar le 25-08-2003 à 14:20:30

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°496840
Le Castor
Neurasténique...
Posté le 25-08-2003 à 14:23:53  profilanswer
 

gm_superstar a écrit :


Nan, cherche pas, y'a pas de solution universelle à ce problème ;)
 
Par contre c'est un bon exercice pour comprendre le fonctionnement du positionnement et les bugs de IE :D


 
MAIS j'y suis presque ! Encore deux-trois babiolle à corriger, j'y suis pas loin... :D


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°496841
fastclemmy
(re-)Dictateur en plastique
Posté le 25-08-2003 à 14:24:33  profilanswer
 

Le Castor a écrit :


 
MAIS j'y suis presque ! Encore deux-trois babiolle à corriger, j'y suis pas loin... :D  


 
Généralement c'est le 2/3 babioles qui posent problème :D

n°496851
Le Castor
Neurasténique...
Posté le 25-08-2003 à 14:31:04  profilanswer
 

fastclemmy a écrit :


 
Généralement c'est le 2/3 babioles qui posent problème :D


 
 [:cid] Saloperie de browser à la con qui font pas ce qu'on veut  :cry:  :cry:  
 
MAIS (oui encore un mais), Le Castor n'abandonne jamais, surtout quand c'est pas réalisable !


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°496867
Hermes le ​Messager
Breton Quiétiste
Posté le 25-08-2003 à 14:38:49  profilanswer
 

BON ET BIEN LE CARAMBAR EST POUR MOI !!!!!!!!!!!!!!!!!!
 
 
 :bounce:  :bounce:  :bounce:  
 
J'ai finalement trouvé la soluce.  :love:  
 

Code :
  1. <?xml version="1.0" encoding="iso-8859-1"?>
  2.     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  3.    
  4.     <html>
  5.    
  6.      <head>
  7.      <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
  8.      
  9.     <style>
  10.     <!--
  11.    
  12.     html,body   { margin: 0; padding: 0; overflow: hidden }
  13.     html,body { height: 100% }
  14.    
  15.     .tbl  { position: relative; width: 100%; height: 100% }
  16.     .td1 { background-color: blue; position: relative; height: 50px }
  17.     .td2  { background-color: green; vertical-align: top; position: relative }
  18.     .td3 { background-color: yellow; position: relative; height: 50px }
  19. .intercall  { position: relative; width: 100%; height: 100% }
  20. .test   { position: absolute; z-index: 1; width: 100%; height: 100%; overflow: auto }
  21.     -->
  22.     </style> 
  23.      
  24.      </head>
  25.    
  26.      <body>
  27.      
  28.      <table class="tbl" cellspacing="0" cellpadding="0">
  29.       <tr>
  30.        <td class="td1"></td>
  31.       </tr>
  32.       <tr>
  33.        <td class="td2">
  34.        <div class="intercall">
  35.        <div class="test">
  36.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  37.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  38.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  39.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  40.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  41.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  42.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  43.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  44.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  45.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  46.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  47.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  48.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  49.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  50.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  51.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  52.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  53.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  54.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  55.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  56.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  57.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  58.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  59.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  60.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  61.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  62.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  63.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  64.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  65.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  66.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  67.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  68.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  69.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  70.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  71.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  72.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  73.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  74.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  75.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  76.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  77.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  78.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  79.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  80.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  81.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  82.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  83.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  84.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  85.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  86.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  87.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  88.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  89.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  90.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  91.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  92.        ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb
  93.        </div>
  94.        </div>
  95.        </td>
  96.       </tr>
  97.       <tr>
  98.        <td class="td3"></td>
  99.       </tr>   
  100.      </table>
  101.      
  102.      </body>
  103.    
  104.     </html>


 
Compatible IE 5+, Moz 1+ et Opera 7+

n°496875
Le Castor
Neurasténique...
Posté le 25-08-2003 à 14:41:28  profilanswer
 

Hermes le Messager a écrit :

BON ET BIEN LE CARAMBAR EST POUR MOI !!!!!!!!!!!!!!!!!!
 
 
 :bounce:  :bounce:  :bounce:  
 
J'ai finalement trouvé la soluce.  :love:  
 
Compatible IE 5+, Moz 1+ et Opera 7+


 
PERDU  :D  
 
Chez moi ça marche pas sous Moz 1.4, y'a un gros rectangle bleu, puis de suite un jaune, et après juste du blanc...


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°496882
Hermes le ​Messager
Breton Quiétiste
Posté le 25-08-2003 à 14:42:54  profilanswer
 

Le Castor a écrit :


 
PERDU  :D  
 
Chez moi ça marche pas sous Moz 1.4, y'a un gros rectangle bleu, puis de suite un jaune, et après juste du blanc...


 
Ah ?? Chez moi, Moz 1.0 marche parfaitement...  :heink:  
 
QQu d'autre peut vérifier SVP...  :??:

mood
Publicité
Posté le 25-08-2003 à 14:42:54  profilanswer
 

n°496883
fastclemmy
(re-)Dictateur en plastique
Posté le 25-08-2003 à 14:43:00  profilanswer
 

Le Castor a écrit :


 
PERDU  :D  
 
Chez moi ça marche pas sous Moz 1.4, y'a un gros rectangle bleu, puis de suite un jaune, et après juste du blanc...


 
Un drapeau ukrainien quoi [:ddr555]
 
EDIT : idem sur firebird 0.6 + scrollbars dès le début sur IE6.


Message édité par fastclemmy le 25-08-2003 à 14:43:32
n°496889
Hermes le ​Messager
Breton Quiétiste
Posté le 25-08-2003 à 14:45:34  profilanswer
 

Je prend firebird et je regarde...  :sweat:

n°496902
gm_superst​ar
Appelez-moi Super
Posté le 25-08-2003 à 14:49:41  profilanswer
 

Hermes le Messager a écrit :

QQu d'autre peut vérifier SVP...  :??:


Je confirme :o
 
 
 
 
Bah de toute façon y'a qu'à faire des frames, c'est autorisé en XHTML 1.0 [:neowen]


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°496908
Le Castor
Neurasténique...
Posté le 25-08-2003 à 14:52:11  profilanswer
 

gm_superstar a écrit :


Je confirme :o
 
 
 
 
Bah de toute façon y'a qu'à faire des frames, c'est autorisé en XHTML 1.0 [:neowen]  


 
Frames =  [:alana21]


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°497210
Le Castor
Neurasténique...
Posté le 25-08-2003 à 17:23:18  profilanswer
 

HHHHHHHHHHHHHHHIIIIIIIIIIIIIIIIIIIIIHHHHHHHHHHHHAAAAAAAAAAAAA
 
 
Le carambar est pour moi !
 

Code :
  1. <?xml version="1.0" encoding="iso-8859-1"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
  5. <head>
  6.  <title>Test</title>
  7.  <style type="text/css">
  8.   body {
  9.       position: fixed;
  10.       top: 0px;
  11.       left: 0px;
  12.       bottom: 0px;
  13.       right: 0px;
  14.       overflow: auto;
  15.       margin: 0px;
  16.       padding: 50px 0px 50px 0px;
  17.     }
  18.     .header {
  19.      position: absolute;
  20.      top: 0px;
  21.      width: 100%;
  22.    height: 50px;
  23.      background-color: green;
  24.     }
  25.     .content {
  26.    width: auto;
  27.       height: 100%;
  28.    overflow: auto;
  29.       background-color: blue;
  30.     }
  31.   .footer {
  32.      position: absolute;
  33.      bottom: 0px;
  34.      width: 100%;
  35.    height: 50px;
  36.      background-color: yellow;
  37.   }
  38.     </style>
  39. </head>
  40. <body>
  41.  <div class="header">
  42.  </div>
  43.   <div class="content">
  44.   Start<br />
  45.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  46.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  47.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  48.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  49.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  50.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  51.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  52.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  53.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  54.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  55.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  56.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  57.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  58.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  59.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  60.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  61.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  62.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  63.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  64.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  65.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  66.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  67.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  68.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  69.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  70.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  71.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  72.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  73.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  74.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  75.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  76.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  77.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  78.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  79.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  80.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  81.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  82.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  83.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  84.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  85.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  86.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  87.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  88.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  89.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  90.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  91.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  92.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  93.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  94.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  95.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  96.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  97.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  98.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  99.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  100.     End
  101.   </div>
  102.  <div class="footer">
  103.  </div>
  104.   </body>
  105. </html>


 
Testé sour IE6, et Mozilla 1.4 !
 
Le problème en fait, est le body : sous IE, il est égal, par défaut, à toute la surface de l'écran. Sous Mozilla, c'est un truc vide, et même si on met height: 100%;, il reste vide. Suffit donc d'utiliser un position: fixed; , et on met toute les "frontières" à 0, pour qu'il prenne la taille de tout l'écran. J'utilise un position: fixed; parce que explorer le gère pas, donc il va pas broncher. Au cas où il le gérerait un jour, je pense pas que ça poserait un problème...


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°497224
fastclemmy
(re-)Dictateur en plastique
Posté le 25-08-2003 à 17:28:18  profilanswer
 

Y'a une bande blanche sous la zone bleue :/, sinon effectivement ça marche bien ici sous IE6 et Firebrid 0.6.1

n°497230
Le Castor
Neurasténique...
Posté le 25-08-2003 à 17:29:51  profilanswer
 

fastclemmy a écrit :

Y'a une bande blanche sous la zone bleue :/, sinon effectivement ça marche bien ici sous IE6 et Firebrid 0.6.1


 
ha ? moi j'ai pas de bandes blanches, étrange...


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°497239
fastclemmy
(re-)Dictateur en plastique
Posté le 25-08-2003 à 17:31:46  profilanswer
 

Le Castor a écrit :


 
ha ? moi j'ai pas de bandes blanches, étrange...


 
Sous Opera 7 je voulais dire.

n°497247
Le Castor
Neurasténique...
Posté le 25-08-2003 à 17:33:46  profilanswer
 

fastclemmy a écrit :


 
Sous Opera 7 je voulais dire.


 
Mais sachant que Opera représente moins de 1% des navigateurs...
 
Sinon ça doit être une histoire de margin, un truc dans l'genre.


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°497270
Le Castor
Neurasténique...
Posté le 25-08-2003 à 17:47:13  profilanswer
 

Ch'uis tellement content d'avoir réussi ça, j'ai proposé un article là-dessus sur openweb  :D  [:audi]


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°497272
Hermes le ​Messager
Breton Quiétiste
Posté le 25-08-2003 à 17:47:21  profilanswer
 

Un grand bravo a toi deja... Respect  :jap:  :jap:  
 
Sinon, il faut reussir a resoudre le bleme pour opera 7, c'est important. On ne fait pas de page pour tel ou tel nav, on fait des pages pour tous les navs recents en particulier ceux qui font des efforts pour respecter les normes, et opera en fait partie.
 
Par contre, je comprends toujours pas pourquoi avec Moz 1, mon truc passe sans bleme, et avec 1.4, marche po. Aurais-je exploite un bug de moz 1 corrige depuis...  :whistle:

n°497277
Le Castor
Neurasténique...
Posté le 25-08-2003 à 17:49:34  profilanswer
 

Hermes le Messager a écrit :

Un grand bravo a toi deja... Respect  :jap:  :jap:  
 
Sinon, il faut reussir a resoudre le bleme pour opera 7, c'est important. On ne fait pas de page pour tel ou tel nav, on fait des pages pour tous les navs recents en particulier ceux qui font des efforts pour respecter les normes, et opera en fait partie.
 
Par contre, je comprends toujours pas pourquoi avec Moz 1, mon truc passe sans bleme, et avec 1.4, marche po. Aurais-je exploite un bug de moz 1 corrige depuis...  :whistle:  


 
Ch'uis en train de télécharger Opera, je verrais bien !


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°497401
Le Castor
Neurasténique...
Posté le 25-08-2003 à 19:10:50  profilanswer
 

Bon, voilà mon mini-site centré :
 

Code :
  1. <?xml version="1.0" encoding="iso-8859-1"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
  5. <head>
  6.  <title>Test</title>
  7.  <style type="text/css">
  8.   body {
  9.    position: fixed;
  10.       top: 0px; left: 0px; bottom: 0px; right: 0px;
  11.       overflow: hidden;
  12.       padding: 0px; margin: 100px 0px 100px 0px;
  13.    color: #000; background-color: #eee;
  14.    font-family: verdana, arial, sans-serif; font-size: 10px; text-align: center;
  15.     }
  16.     .mainContainer {
  17.      width: 800px; height: 100%;
  18.      text-align: left;
  19.      margin: 0px auto 0px auto;
  20.     }
  21.     .header {
  22.      width: 100%; height: 15%;
  23.      padding: 3px 0px 0px 3px;
  24.      color: #000; background-color: #ccc;
  25.      border: 2px solid #aaa;
  26.     }
  27.     .menu {
  28.      float: left;
  29.      width: 120px; height: 75%;
  30.      padding-top: 15px; margin-right: 10px;
  31.      color: #000; background-color: #ccc;
  32.      border: 2px solid #aaa;
  33.     }
  34.     .content {
  35.      float: left;
  36.      width: 665px; height: 75%;
  37.      padding: 0px;
  38.      overflow: auto;
  39.     }
  40.   </style>
  41. </head>
  42. <body>
  43.  <div class="mainContainer">
  44.   <div class="header">
  45.    Header
  46.   </div>
  47.   <div class="menu">
  48.    <ul>
  49.     <li>Menu 1</li>
  50.     <li>Menu 2</li>
  51.     <li>Menu 3</li>
  52.    </ul>
  53.   </div>
  54.   <div class="content">
  55.   Start<br />
  56.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  57.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  58.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  59.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  60.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  61.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  62.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  63.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  64.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  65.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  66.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  67.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  68.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  69.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  70.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  71.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  72.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  73.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  74.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  75.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  76.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  77.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  78.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  79.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  80.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  81.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  82.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  83.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  84.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  85.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  86.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  87.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  88.     ssdfvddvfdvkkfkkfk kfkbk fkbfkbkfb<br />
  89.     End
  90.   </div>
  91.  </div>
  92.   </body>
  93. </html>


 
Avantages :
 - Centré horizontalement ET verticalement
 - Testé sous IE6, Moz1.4 et Opera 7.11
 
Inconvénients :
 - Les hauteurs doivent être en %
 - Impossible de faire au pixel près, faut laisser une tolérance de quelques %


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
n°497416
gm_superst​ar
Appelez-moi Super
Posté le 25-08-2003 à 19:22:01  profilanswer
 

Le Castor a écrit :

- Les hauteurs doivent être en %


Alors tu ne réponds plus au cahier des charges :o
 
Effectivement exprimer les longueurs en % c'est pratique car ça permet d'indiquer à IE une hauteur explicite.


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°497422
Le Castor
Neurasténique...
Posté le 25-08-2003 à 19:26:44  profilanswer
 

gm_superstar a écrit :


Alors tu ne réponds plus au cahier des charges :o
 
Effectivement exprimer les longueurs en % c'est pratique car ça permet d'indiquer à IE une hauteur explicite.


 
 :D  
 
Le problème, c'est que si on fait du fixe, on ne peut pas faire marcher le truc chez tout le monde, y'en a forcément un qui va pas marcher... Quelle désolation !
 
J'dirais aussi que, pour une fois, IE est le meilleur pour ce cas, y'a pas besoin de bricoler avec des position: fixed;.


---------------
W3C : Leading the Web to Its Full Potential... - Membre du W3C l33t club
mood
Publicité
Posté le   profilanswer
 

 Page :   1  2
Page Suivante
Page Précédente
Haut de page 

Aller à :
Ajouter une réponse
 

Sujets relatifs
[php] Trou de sécurité ou pas sur ce site ???[CSS] Site deux colonnes
[XHTML CSS] Passer site de table en divPrix d'un site comme ca..(voir le topic)
vérifier qu'un site est accessiblerecherche site interpolation
Menu pour site webVotre avis et vos suggestions sur un nouveau site !
Afficher sur mon site les données recuperer sur un fichier xml.Votre avis sur la qualité d'un site
Plus de sujets relatifs à : Centrer son site

Forum MesDiscussions.Net, Version 2010.2
(c) 2000-2011 Doctissimo
Page générée en 0.140 secondes

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