| Voir le sujet précédent :: Voir le sujet suivant |
| Auteur |
Message |
salemioche
salemioche
 |
 les pbs denavigateurs... , Posté le: 28-10-2003 15:49 |
|
|
c'est reparti...
div.info {
width: 150px;
padding-left: 5px;
}
avec firebird le div fera 155, et 150 avec IE
youpi, vive les CSS et la compatibilité  .
.
______________________________________
creation site internet - Hébergement web - Agence Web |
|
|
rorschach
dreamweaver mioche
 |
| les pbs denavigateurs... , Posté le: 28-10-2003 17:05 |
|
|
euh... c'est quoi ton code que ton div n'est pas de la même taille sur les navigateur ?!!
ie et mozilla ne calcul pas les boite de la même facon je crois mais moi j'ai obtenu ça :
 |
|
|
salemioche
salemioche
|
| les pbs denavigateurs... , Posté le: 28-10-2003 19:01 |
|
|
Voici le code complet qui permet de voir le pb :
| Code: |
<style>
#info {
height: 80px;
width: 150px;
border: 1px solid black;
margin: 10px;
float: left;
font-size: 7pt;
text-align: left;
padding-top: 3px;
padding-left: 5px;
}
</style>
<div id="info">
<b>Contact</b>
<b>Copyright</b><br>
<br>
xx xx xx xx xx<br>
<br>
<b>contact@saletmoche.com</b>
</div>
|
.
.
______________________________________
creation site internet - Hébergement web - Agence Web |
|
|
rorschach
dreamweaver mioche
|
| les pbs denavigateurs... , Posté le: 28-10-2003 19:32 |
|
|
Bon alors les 3 div on la même taille par contre sous IE la marge autour du div est plus importante mais ce petit problème peut etre réglé en utilisant un margin:0px; pour ton div et en indiquant ta marge de 10px dans le style du body ce qui donne (j'ai changer la taille de la bordure pour bien mettre en evidence la taille des div) :
| Code: |
body {
padding: 0;
margin: 10px; /* Ici je place ma marge de 10 pixels */
}
#info {
height: 80px;
width: 150px;
border: 10px solid black;
margin: 0px; /* Ici je place une marge de 0 pixel */
float: left;
font-size: 7pt;
text-align: left;
padding-top: 3px;
padding-left: 5px;
}
|
et pour la page html :
| Code: |
<body>
<div id="info">
<b>Contact</b>
<b>Copyright</b><br>
<br>
xx xx xx xx xx<br>
<br>
<b>contact@saletmoche.com</b>
</div>
</body>
|
ce qui donne en image :
soit un div de même taille sous mozilla et sous ie
 |
|
|
salemioche
salemioche
|
| les pbs denavigateurs... , Posté le: 28-10-2003 19:36 |
|
|
belle astuce, mais ma mise en page est nettement plus complexe et ne me permet pas cette fantaisie (enfin je crois, quand le projet sera en ligne je vous donnerais la page comme challenge )
belle demo quand meme  .
.
______________________________________
creation site internet - Hébergement web - Agence Web |
|
|
salemioche
salemioche
|
| les pbs denavigateurs... , Posté le: 29-10-2003 14:36 |
|
|
ici, http://www.w3.org/TR/CSS2/visudet.html#propdef-height on peut lire
| Citation: |
| height: This property specifies the content height of boxes generated by block-level and replaced elements. |
ce qui veux dire a priori que l'espace pris par un element en hauteur (la demo est identique pour la largeur) :
h = margin-top + border-top + padding-top + height + padding-bottom + border-bottom + margin-bottom
alors que mozilla fait exactement cela, IE inclus le padding et la bordure, donc pour IE on a :
h = margin-top + height + margin-bottom
c'est a dire que la hauteur du contenu est :
content height = height - (border-top + padding-top + padding-bottom + border-bottom)
je suis en train de me casser la tete avec ca, CSS et XHTML c'est bien, utiliser que des div et pas des tables c'est bien, mais comme au bon vieux temps du javascript/Jscript ben c'est la merde !!!.
.
______________________________________
creation site internet - Hébergement web - Agence Web |
|
|
rorschach
dreamweaver mioche
|
| les pbs denavigateurs... , Posté le: 29-10-2003 16:26 |
|
|
c'est certains qu'il faut un peu jongler avec les feuilles de style pour avoir la même presentation au pixels pres dans tout les navigateur et ce sera surement comme cela tant que microsoft ne s'alignera pas avec sur standard du w3c
http://openweb.eu.org/articles/dimensions_boites_css/ [http://openweb.eu.org/articles/dimensions_boites_css/] |
|
|
|
S'enregistrer
Profil
Se connecter pour vérifier ses messages privés
Rechercher
Membres
FAQ
Connexion
