[XHTML] width + border sous IE

**Death83** · 01/10/2006, 00h02

Salut a tous,

cette fois ci j'ai un probleme avec IE. En fait j'ai un cadre d'une largeur de 165 pixel avec une bordure de 1 px.

Le problème que j'ai est qu'avec IE le cadre fait toujours 165 px de large avec les bordures alors que sous les autres navigateurs le cadre (avec les bordures) fait 167px.

Est-ce-normal? Si oui comment remédier à ce problème?

Merci d'avance!

**JackBeauregard** · 01/10/2006, 00h29

Oui j'ai rencontré plusieurs fois ce problème entre firefox et IE, c'est très pénible. Dans un des deux cas les bordures semblent être à l'extérieur, donc ajoutée à la dimension du cadre.
Sur IE7 j'ai constaté que ce problème avait disparu de mon site. Sinon je crois que je l'avais plus ou moins résolu en ajustant le padding ou les dimensions mais dès fois sur firefox la bordure ne s'affichait alors plus, il fallait réactualiser la page.

**Death83** · 01/10/2006, 01h10

Envoyé par JackBeauregard

Oui j'ai rencontré plusieurs fois ce problème entre firefox et IE, c'est très pénible. Dans un des deux cas les bordures semblent être à l'extérieur, donc ajoutée à la dimension du cadre.
Sur IE7 j'ai constaté que ce problème avait disparu de mon site. Sinon je crois que je l'avais plus ou moins résolu en ajustant le padding ou les dimensions mais dès fois sur firefox la bordure ne s'affichait alors plus, il fallait réactualiser la page.

Justement la je teste avec IE7 et j'ai bien le problème

.

J'ai essayer de bidouiller avec des padding mais il y a rien a faire, les écarts s'additionne pareil avec tout les navigateur, donc impossible de rattraper les 2 pixels mordu par IE :/.

Il doit bien avoir une solution( mais laquelle)...

**Candygirl** · 01/10/2006, 01h17

Petite question:

As-tu bien définis un doctype correct en haut de ta page ?

**Death83** · 01/10/2006, 02h03

oui j'ai mis celui pour le XHTML 1.1:

J'ai ca en haut de mes pages:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

J'ai essayé egalement avec XHTML 1.0 strict mais ca fait pareil.

**francis m** · 01/10/2006, 02h32

le problème est connu : sous ie et navigateurs similaires, tel que myIE et je pense maxthon, la bordure est comprise dans la largeur du bloc (donc 165px dans ton cas), alors que ff et netscape mettent la bordure à l'extérieur du bloc (donc 167px dans ton cas)

Sur le fond tu ne peux rien faire de propre. La seule solution est de faire un patch spécifique pour ie, par exemple rajouter cette ligne dans le <head>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<!--[if IE]><style type="text/css">.cadre { width:167px; }</style><![endif]-->

**Death83** · 01/10/2006, 12h07

Envoyé par francis m

le problème est connu : sous ie et navigateurs similaires, tel que myIE et je pense maxthon, la bordure est comprise dans la largeur du bloc (donc 165px dans ton cas), alors que ff et netscape mettent la bordure à l'extérieur du bloc (donc 167px dans ton cas)

Sur le fond tu ne peux rien faire de propre. La seule solution est de faire un patch spécifique pour ie, par exemple rajouter cette ligne dans le <head>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<!--[if IE]><style type="text/css">.cadre { width:167px; }</style><![endif]-->

Arf, ca m'embête car sur mon site je propose plusieurs style donc je peut pas me permettre de mettre des styles hors des feuilles de styles :/.

**ilood** · 01/10/2006, 13h01

Salut

Tu peux mettre n'importe quelle balise html entre les commentaires conditionnels

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<!--[if IE]>
<link href="css_pour_ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

Sinon essaie de virer le prologue xml

**Death83** · 01/10/2006, 13h54

A oui ok, en fait je garde ma feuille normal et apres j'appel une spécifique à IE qui écrasera les valeur déja déclaré.

Je vais essayer.

**Death83** · 01/10/2006, 14h07

C'est bon ca marche ^^.

Merci bien

.

**Candygirl** · 01/10/2006, 18h21

Je reviens néanmoins à la charge avec le doctype

En fait lorsque le doctype n'est pas déclaré tout en haut IE ne l'interprète pas et reste sur son model de boîte à la Microsoft qui va te poser bien des soucis. Tu peux faire un test tout simple avec cet exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans nom</title>
<style type="text/css">
<!--
#test {
  width:165px;
        height:165px;
        border:1px solid #000;
}
-->
</style>
</head>
<body>
<div id="test"></div>
</body>
</html>

et tu verras que ton div fait aussi 167px avec IE car cette fois-ci il aura pris en compte le doctype.

Il faut voir si, dans ton cas, la déclaration xml est nécessaire ou pas.

**Death83** · 01/10/2006, 22h26

Pour ca j'ai utiliser un petit script qui sélectionne automatiquement le doctype a prendre. Et maintenant ca marche, j'ai bien une page XML en XHTML 1.1 sous FF (je le vois quand il y a des erreurs, ou j'ai une erreur de page XML mal formée) et sous IE ca passe automatiquement en text/html et XHTML A.0 strict.

**Auteur** · 02/10/2006, 01h10

bonjour,

Pour ca j'ai utiliser un petit script qui sélectionne automatiquement le doctype a prendre. Et maintenant ca marche, j'ai bien une page XML en XHTML 1.1 sous FF (je le vois quand il y a des erreurs, ou j'ai une erreur de page XML mal formée) et sous IE ca passe automatiquement en text/html et XHTML A.0 strict.

pourrais-je voir le code qui te permet de sélectionner le doctype ? Ca m'intéresse.

**Death83** · 02/10/2006, 03h02

Pas de problème

.

voilà tu va voir c'est magique et ca marche niquel

:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
if(stristr($_SERVER["HTTP_ACCEPT"],"application/xhtml+xml"))
{
	header("Content-Type: application/xhtml+xml; charset=iso-8859-1");
	echo '<?xml version="1.0" encoding="iso-8859-1"?>';
	echo('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">');  
} 
else 
{
	header("Content-Type: text/html; charset=iso-8859-1");
	echo (' <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">');
}

**Auteur** · 02/10/2006, 11h09

Il serait sans doute intéressant de l'ajouter dans la FAQ PHP ou ( peut-être ? ) HTML.

La fonction header, c'est bien pour ajouter une balise meta dans le document ?

**Death83** · 03/10/2006, 14h32

Envoyé par Auteur

Il serait sans doute intéressant de l'ajouter dans la FAQ PHP ou ( peut-être ? ) HTML.

La fonction header, c'est bien pour ajouter une balise meta dans le document ?

Non pas vraiment (ca en reviens au même), ca informe l'entete du type de document (ce que tu fais dans tes meta quand tu dis <meta content="" ....)

[XHTML] width + border sous IE

HTML

Discussions similaires

Partager

Partager