Bordure et css
Bordure et css - HTML/CSS - Programmation
Marsh Posté le 30-04-2006 à 00:52:09
Bonsoir,
De peur de dire une bêtise à cette heure tardive, pour tout savoir sur les CSS, je ne peux que te conseiller quelques sites:
alsacreations
Openweb
petit sute sympa
et il y en a d'autres bien entendu.
@+
---------------
Un forum étant un lieu d'échange, j'accepte les MP uniquement pour les rendez-vous coquins - Imac PPC G3 350Mhz Mac OS X 10.3.9
Marsh Posté le 30-04-2006 à 02:39:21
Oui, IE et FF n'interprètes pas de la même facon les bordures malheureusement, apparement FF ne compte pas la bordure comme faisant partie de la taille d'un div alors qu'IE oui... concernant Opera je ne sais pas, je ne me suis pas penché sur la question.
Marsh Posté le 30-04-2006 à 10:19:03
Opera ne semble pa savoir la même politique que firefox avec les bordures.
J'ai regardé tes sites Oualad (en survol), mais je n'ais pas trouvé d'indication au sujet des bordures.
Si quelqu'un sait si le wc3 compte ou non les bordures dans la taille des div, il peut intervenir sur ce topic ![[:aztechxx]](https://forum-images.hardware.fr/images/perso/aztechxx.gif "[:aztechxx]")
Marsh Posté le 30-04-2006 à 10:34:21
Reply
Marsh Posté le 30-04-2006 à 10:53:50
http://www.quirksmode.org/css/box.html
---------------
Me: Django Localization, Yogo Puzzle, Chrome Grapher, C++ Signals, Brainf*ck.
Marsh Posté le 30-04-2006 à 11:04:43
Cool merci.
| Citation : * Not surprisingly, Explorer keeps to the Microsoft model, with the interesting exception of Explorer 4 on Mac, which uses the W3C model. Netscape 4 and Opera 7 also use the traditional model. |
W3c : La taille d'un div n'inclu pas les bordures et padding.
(je trouve ça aussi mal foutu)
Firefox respecte le w3c.
Opera non.
C'est bizzare, mais moi j'aurais dit l'inverse, que opera respectait et pas firefox, parceque dans opera mes box avec bordure sont un peu plus grande que sous firefox (ce qui m'inssite à dire que c'est opera qui ne compte pas les bordures dans la taille, et que donc c'est normal qu'il décale de 2 pixels).
Marsh Posté le 30-04-2006 à 11:07:52
( au premier abord, ca parait mal foutu, et y'a des cas ou ca te permet des trucs assez pratiques... et des cas ou ca t'emmerde, mais les 2 ont leur utilité )
---------------
Me: Django Localization, Yogo Puzzle, Chrome Grapher, C++ Signals, Brainf*ck.
Marsh Posté le 30-04-2006 à 11:10:25
J'ai lu que dans les css3 ont pourra choisir (soit dans 20 ans :-).
Message édité par Siron le 30-04-2006 à 11:10:34
Marsh Posté le 30-04-2006 à 11:19:41
C'est : box-sizing:border-box;
Il est mis que opera et ie de mac le supporte déja.
Firefox lui supporte un truc comme -moz-box-sizing:border-box;
J'ai essayé avec content et border pour box-sizing, et sous opera ça ne change rien (c'est sous opera que tout est décalé).
Marsh Posté le 30-04-2006 à 14:10:23
Box Model Microsoft != Box Model W3C
Imaginons un élément (comprenons par là <div>texte/div> ou bien <a href="#">mon contenu</a> ) comme une boite.
Une boite étant composée de plusieurs épaisseurs : en partant du plus à l'extrême vers le plus intérieur :
Margin : Marge à l'extérieur de la bordure de la boite
Broder : bordure de la boite
Padding : marge interne de la boite
Contenu : Contenu de la boite (texte)
Dans le box model microsoft, lorsque l'on applique une largeur sur un élément la largeur s'applique sur l'extérieur des bordures
Donc si ton bloc fait : padding :20px, border:10px; width:200px
il fera exactement 200px de large
Dans le box model W3C, lorsque l'on applique une largeur sur un élément la largeur s'applique sur l'extérieur des bordures
ton bloc ne fera pas 200px de large mais :
200 + 2x20 + 2x10 = 260px, car la largeur s'applique sur le contenu.
Pour que IE se comporte de la même manière que Firefox (et autres navigateurs respectueux des normes)
il faut utiliser un doctype avec URL
ex :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
et un ptit article : http://www.alistapart.com/stories/doctype/
Marsh Posté le 30-04-2006 à 16:56:34
Merci pour ces precisions. 
Message édité par Siron le 30-04-2006 à 16:56:52
Sujets relatifs:
- image flottante: espace entre bordure et image
- Problème de bordure de tableau CSS sous Internet Explorer
- Bordure Flash
- Block avec bordure complete en CSS
- [PHP][GD][Résolu] Création de bordure en fondu
- bordure juste pour qq cases d'un tableau
- Tableaux HTML et bordure ?
- bordure d'une image (mouse hover)
- Bordure avec ballon de soccer
- Avoir une bordure de 1px dans un tableau ?
Marsh Posté le 29-04-2006 à 20:15:55
Bonjour.
J'aimerais savoir comment les bordures influences la taille d'un div, sont elles placées a l'interieur d'un div ?
Ou à l'extérieur ?
J'aimerais aussi savoir si c'est normal que opera interprete différemment la position des bordures que firefox (à un pixel près, ce qui crée des décallage dans le design global de la page) ?
Merci pour les réponses.
Siron