DIV au comportement bizarre

[alain78]

Bonjour,
J'ai un DIV simple que j'ai par facilité intégré dans une fonction.

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
function fen_gene($left,$top,$right,$bottom,$large,$haut,$ph,$pb,$pg,$pd,$border)
{
$ph=$ph."px";
$pg=$pg."px";
$pb=$pb."px";
$pd=$pd."px";
$border=$border."pt";
echo "<div ID='layer2'
STYLE='
margin:0;
padding-top:$ph;
padding-left:$pg;
padding-bottom:$pb;
padding-right:$pd;
border-width:$border;
border-color:blue;
border-style:solid;
font-size:{$_SESSION['taille_police']};
background-color:{$_SESSION['couleur_fenetre']};
width:".$large."%;
height:".$haut."%;
position:absolute;
left:".$left."%;
top:".$top."%; z-index:1';'>";
}

A partir de mes scripts je crée des fenêtres en appelant cette fonction avec les paramètres.

Or voici une fenêtre au comportement bizarre :

Code :

1
2
 
    fen_gene(2,15,0,0,"","",10,10,10,10,1) ;

cette fenetre contient 3 champs INPUT de type texte dont la largeur est fixe : 50.

Voici ce qui se passe. J'utilise en simultané 2 machines qui se connectent au même serveur en même temps. Toutes deux utilisent le même script (sur serveur externe) et IE 8.

Sur la machine 1 (OS=AMD):
sous IE : la largeur de la fenêtre s'adapte bien au contenu (la largeur est laissée à "").

sous Netscape (Mozilla) : idem

Sur la machine 2 (OS=Intel)
sous Netscape (Mozilla) : tola largeur de la fenêtre s'adapte bien au contenu.
sous IE : la largeur de la fenêtre n'est pas reconnue. La fenêtre s'étire jusqu'au bord droit de l'écran ???

Avez vous déjà rencontré ce problème ?

J'ai tout recherché. Je ne vois pas.

Merci à vous si vous avez des suggestions.

[Auteur]

bonjour,

si j'ai bien compris ton code (je ne fais pas de PHP), si la largeur et la hauteur du div ne sont pas précisées j'obtiens :

(je n'ai mis que les propriétés width et height)

Code :

1
2
 
<div id='layer2' style='width:%; height:%'>

Tu as donc deux propriétés sans valeur. La source du problème est peut-être là. Essaye d'ajouter une condition telle que si tes valeurs large et haut ne sont pas définies (valeur nulle, négative, ...), tu n'insères pas ces propriétés dans l'attribut style.

En passant : écris l'attribut id en minuscules

[polymorphisme]

Bonjour,

-- dans ta fonction, tu ne peux pas avoir : div ID='layer2'
car l'attribut ID doit être unique !

-- $ph=$ph."px";, de mémoire, il me semble qu'en PHP, on peut écrire : $ph.="px";

-- padding-top:$ph; : dans cet extrait de code, ta variable ph n'est pas substituée à sa valeur puisque c'est une chaîne de caractère.

-- astuce : écrit des fonctions simples.
Dans six mois, te souviendra tu des paramètres de ta fonction fen_gene ?

Code :

fen_gene(2,15,0,0,"","",10,10,10,10,1) ;

-- autre astuce : OS signifie Operating System, Système d'exploitation; AMD et Intel sont des marques de microprocesseurs, il me semble. A priori, il n'y a pas de liens directs entre ton processeur et ton navigateur.

[alain78]

Merci à polymorphisme et à Rédacteur pour m'avoir répondu. J'ai finalement trouvé la solution mais avant de vous la livrer, je vous apporte quelques précisions :

1° Dans mon DIV les 2 valeurs ne sont pas indiquées. Cela est normal car dans ce cas les valeurs seront déduites de celles indiquées à l'intérieur du DIV.
Je m'explique : si dans mon DIV il y a un champ INPUT avec une largeur (SIZE = 100 par exemple) alors la largeur du DIV sera adaptée à cette largeur en respectant les marges demandées à gauche et à droite.
On obtient le même résultat si dans mon DIV j'ai un champ de type SELECT avec un nombre de lignes mentionné. Dans ce cas c'est la hauteur du DIV qui sera adaptée.
En résumé, effectivement il faut indiquer une largeur...quelque part, soit dans le contenant (DIV) soit dans l'un des éléments du contenant (champ INPUT, SELECT, TEXTAREA...etc.)

2°Ecriture des fonctions
Pas de soucis, je suis d'accord mais dans le cas de cette fonction, les paramètres sont bien explicités dans la fonction elle même.

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
function fen_gene($left,$top,$right,$bottom,$large,$haut,$ph,$pb,$pg,$pd,$border)
{
$ph=$ph."px";
$pg=$pg."px";
$pb=$pb."px";
$pd=$pd."px";
$border=$border."pt";
echo "<div ID='layer2'
STYLE='
margin: 0;
padding-top:$ph;
padding-left:$pg;
padding-bottom:$pb;
padding-right:$pd;
border-width:$border;
border-color:blue;
border-style:solid;
font-size:{$_SESSION['taille_police']};
background-color:{$_SESSION['couleur_fenetre']};
width:".$large."%;
height:".$haut."%;
position:absolute;
left:".$left."%;
top:".$top."%; z-index:1';'>";
}

3°padding-top:$ph; : dans cet extrait de code, ta variable ph n'est pas substituée à sa valeur puisque c'est une chaîne de caractère.
Désolé, mais la variable est bien substituée et la valeur numérique adressée sous forme de chaine de caractère est bien prise en compte. J'ai fais les vérifications avec plusieurs valeurs.

4° OK pour les OS, je savais mais je me demandais si l'erreur ne venais pas du BIOS (j'ai écrit OS par erreur) utilisé par AMD qui est (légèrement) différent de celui utilisé par Intel.

Voici donc le pourquoi de l'erreur constatée.

En fait dans IE8 dans le menu Outils, l'affichage de compatibilité était coché. Après l'avoir décoché, tout est rentré dans l'ordre et mes DIV sont affichés comme je les ai codés.

Merci à vous et bonne fin de dimanche.