CSS - Bordures et contenant

[yannouk]

Je rencontree un probleme avec les largeurs de divs lorsqu'on leuir applique une bordure.

J'ai un contenant qui fait 760 Px et à une bordure de 1px
Je place un div de largeur 100%.
Si je mets une bordure de 10 px à ce div, voila ce qu'il se passe:

sous opera:
-A gauche la bordure se calle contre celle de mon contenant. Le contenu du div se retrouve decallé de 10 px sur la gauche (normal)
-A droite, Le div est donc plus large que le fond car il a été decalé de 10px et sa largeur reste egale a 100% soit 760px.
MAIS: le contenant reste à 760 px et ne se redimensionne aps automatiquement, donc le div deborde

Sous IE:
Pareil sauf que le contenant s'ajuste automatiquement.

Ce que je voudrais c'est eviter cette difference d'interprétation, dans un sens ou dans l'autre ca m'est égal!
Je précise que j'ai mis un doctype xhtml sans prologue xml donc pas de probleme de box model

[juliofromlille]

Je te conseil d'aller poster là...

http://dreamweaver.media-box.net/viewforum.php?f=27

C'est bizarre quand même, je ne connais pas cette astuce pour faire basculer en respectant le modele des boîtes mais si tu dis que ce n'est pas cela je te crois...

[yannouk]

merci pour le lien je vais rzegarder de plus pres

[MarvinLeRouge]

C'est IE qui a tort : lorsque la largeur d'un élément est fixée, elle ne doit pas être modifiée.
En fait, je suppose que tu as du faire un contenant avec une règle du genre :

Code: Tout sélectionner

#contenant
{
  width : 760px;
}


chose qui devrait garantir la largeur de ton contenant, quoi qu'il arrive (contenu plus pletit ou plus grand), mais IE ne le voit pas de cette oreille (ben oui forcément avec ses oreilles il voit mal ) : il interprète ton width comme un min-width, et l'adapte donc si ça dépasse.
Si tu veux avoir une largeur adaptative avec IE ET avec les navigateur qui respectent les CSS, il te faudrait un hack du genre :

Code: Tout sélectionner

#contenant
{
  width : 760px;
}
body>#contenant
{
  min-width : 760px;
  width : auto;
}


IE n'interprète pas le symbole ">" et ne lira donc pas la 2ème rêgle.

Si tu veux une largeur qui ne dépasse pas de la fenêtre quel que soit le cas, il te faudra utiliser des unités relatives et vaincre les erreurs d'IE.
Je te conseille ce site.