Affichage bizarre

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
jpboogie
Salamandre
Messages : 22
Inscription : 28 oct. 2005, 13:37

Affichage bizarre

Message par jpboogie »

Bonjour :D

Je viens tout juste d'installer FireFox 1.0.7 sous Windows XP et tout va bien excepté un petit souci d'affichage de mes pages WEB contenant des feuilles de styles.

Tout est décalé !!! :(

Je ne sais pas trop expliquer le problème, mais il est visible en consultant mon site : http://jpboogie.free.fr.

Ce problème ne se produit pas avec Internet Explorer :oops:

Help !!!!
Boogie Woogie All Night Long
SB
Varan
Messages : 1095
Inscription : 05 mars 2004, 18:38

Message par SB »

Probablement un problème de code.
Consulte cette page : http://www.openweb.eu.org/articles/toi_comprendre_moi/
Puis rectifie les erreurs que tu trouveras là :

Code : Tout sélectionner

http://validator.w3.org/check?uri=http%3A%2F%2Fjpboogie.free.fr%2Faccueil.php&charset=iso-8859-15+%28Latin+9%29&doctype=Inline&ss=1&verbose=1
Pour le son : http://www.geckozone.org/faq/index.php? ... hap=7#n2.9
jpboogie
Salamandre
Messages : 22
Inscription : 28 oct. 2005, 13:37

Message par jpboogie »

:D Merci bien pour ces infos, cela va m'aider un max.

Tant q'uon y est il semblerait qu'au niveau des feuilles de style, avec FireFox , background-image('xxxxx'); n'accepte que des images au format gif. Me gourje ? Ce n'est pas un problème, mais bon il faut le savoir. C'est en fait en partie ce qui pourissait mon affichage.
Boogie Woogie All Night Long
Flore
Administratrice
Messages : 3567
Inscription : 19 nov. 2003, 23:04

Message par Flore »

jpboogie a écrit ::D Merci bien pour ces infos, cela va m'aider un max.

Tant q'uon y est il semblerait qu'au niveau des feuilles de style, avec FireFox , background-image('xxxxx'); n'accepte que des images au format gif. Me gourje ?
Complètement :lol: :lol: :lol: . Qu'est ce qui a pu te faire croire ça ?
Petit extrait de la css geckozone :

Code : Tout sélectionner

{background-image: url(images/header_bg.png);}
C'est le logo en haut à droite avec tous les logos ;)
Flore
Mac OSX + Nightly / Laptop Linux Mint + Nightly / Nightly sur Android
Ben.d2
Iguane
Messages : 597
Inscription : 03 mai 2004, 13:12

Message par Ben.d2 »

A ma connaissance il n'y a pas de limite sur le type de l'image avec Firefox sur cette propriété :?

Mais le code exact est le suivant :

Code : Tout sélectionner

background-image: url(adresse_image);
SB
Varan
Messages : 1095
Inscription : 05 mars 2004, 18:38

Message par SB »

Ça progresse mais : :)
1)

Code : Tout sélectionner

<html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
inverse en

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
(sur la page d'accueil, supprime simplement le premier <html>)
2)avoir choisi un doctype xhtml strict c'est courageux mais difficile pour un début car ton code est en html 4, il va te falloir faire plein de modifs.
3)

Code : Tout sélectionner

<object type="audio/mpeg" width="0" height="0" data="fichier.mp3">
<param name="filename" value="/songs/samples/J150.mp3" />
<param name="autostart" value="true" />
<param name="loop" value="false" />
</object>
tu as oublié dans la première ligne de remplacer "fichier.mp3" par "/songs/samples/J150.mp3". Du coup onj n'entend plus rien ni avec Fx ni avec IE
Bon courage.
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Juste pour rajouter mon grain de sel dans le sens de ce qu'a déjà dit SB : est-ce vraiment utile de faire du XHTML 1.0 Strict ?

Quand je vois les <br> non fermés, les <p> non fermés, les <meta> non fermés… je me dis que tu aurais probablement meilleur temps de commencer par du HTML 4.01… n'oublie pas que c'est aussi un standard, et qu'avoir la dernière version n'est pas forcément toujours une bonne idée :wink:
(et aussi que contrairement à ce que certains disent, il n'est pas certain que le XHTML représente l'avenir, en tous cas à court et moyen terme).
De même, une variante stricte est-elle vraiment ce qu'il te faux ? Projettes-tu vraiment de séparer de manière stricte le contenu de la mise en page (CSS) ?

J'aurais donc tendance à te conseiller à faire du HTML 4.01 transitionnal ou strict, correspondant à un de ces deux doctypes :

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
:wink:

En conclusion : le XHTML c'est beaucoup de contraintes pour pas grand chose. Le strict c'est bien, mais il ne faut pas oublier qu'on peut le faire aussi en html !

Voilà l'avis de quelqu'un qui a repassé son site en HTML 4.01 il n'y a pas si longtemps que ça… :roll:
jpboogie
Salamandre
Messages : 22
Inscription : 28 oct. 2005, 13:37

Message par jpboogie »

Merci à tous pour vos précieux conseils. En ce qui concerne Le HTML, je crois que je vais opter pour HTML 4 plutôt.

Par contre il y a quand même quelques points qui restent obscurs pour moi.

1 - Le type des fichier dans le CSS background-image:url( 'xxx.jpg') ne fonctionne pas (j'ai été obligé de convertir mon image en gif et là, impeccable...)

2 - Malgrès l'oubli du nom du fichier mp3 dans le tag<OBJECT>, j'avais bien le son avec I.E. Depuis, j'ai fais la modif, mais toujours rien dans FF.

Au chargement de la page qui conteint ce tag, j'ai un message me demandant d'installer des plugins additionels. Apparement il s'agit de QuickTime, mais FF ne le détecte pas et me propose une installation manuelle. Quicktime étant déja installé sur mon PC , je n'y comprend rien.

3 - Le code suivant

Code : Tout sélectionner

<object data="yritmo.mid" type="audio/x-midi" width="300" height="45">
<param name="src" value="/songs/' . $song_title . '">
<param name="controls" value="console" />
<param name="autostart" value="true" />
<param name="loop" value="0" />
</object>
Me permet dans IE d'afficher un player, mais n'a aucun effet avec FF.

Essayez http://jpboogie.free.fr/php/play_song.p ... Winter.mp3

Je suis complètement paumé les gars :D [/url][/b]
Boogie Woogie All Night Long
jpboogie
Salamandre
Messages : 22
Inscription : 28 oct. 2005, 13:37

Message par jpboogie »

OOOPS :oops: l'url de la page évoquée c'est :

http://jpboogie.free.fr/php/playsong.ph ... Winter.mp3

Désolé :D :D
Boogie Woogie All Night Long
Flore
Administratrice
Messages : 3567
Inscription : 19 nov. 2003, 23:04

Message par Flore »

Il faudrait savoir, c'est du midi ou du mp3 ? là tu mélanges tout. C'est l'un ou l'autre, pas les 2 à la fois :

Code : Tout sélectionner

<object data="yritmo.mid" type="audio/x-midi" height="45" width="300">
<param name="src" value="/songs/Winter.mp3">
<param name="controls" value="console">
<param name="autostart" value="true">
<param name="loop" value="0">
</object>
Et pour ton image en jpg, elle était sur le serveur au moins, le lien était bon ? Parce que ça marche dans Firefox.
Flore
Mac OSX + Nightly / Laptop Linux Mint + Nightly / Nightly sur Android
Invité

Message par Invité »

Flore a écrit :Il faudrait savoir, c'est du midi ou du mp3 ? là tu mélanges tout. C'est l'un ou l'autre, pas les 2 à la fois :

Code : Tout sélectionner

<object data="yritmo.mid" type="audio/x-midi" height="45" width="300">
<param name="src" value="/songs/Winter.mp3">
<param name="controls" value="console">
<param name="autostart" value="true">
<param name="loop" value="0">
</object>
Et pour ton image en jpg, elle était sur le serveur au moins, le lien était bon ? Parce que ça marche dans Firefox.
Ben en tout cas ça ne dérange pas I.E. cette histoire de type, ça fonctionne très bien.

En ce qui concerne l'image, bien sûr qu'elle y est et encore une fois sou I.E., pas de problème. Bon c'est pas grave ça marche une fois l'image convertie en gif.
Flore
Administratrice
Messages : 3567
Inscription : 19 nov. 2003, 23:04

Message par Flore »

Le fait que "ça marche sous IE" n'est absolument pas un bon critère. Ma question était "L'image est elle sur le net ?" que je complèterai par "Le chemin est il relatif ou genre file:///c:... ?"
Pas "Est-ce que IE a encore fait une connerie de derrière les fagots pour induire l'utilisateur en erreur ?" (parce que celle là de réponse, je la connais, c'est oui à chaque fois).

Il faut de la rigueur quand on fait du développement web (comme pour beaucoup d'autres choses). Alors primo, vérifier que tout est OK à la source et pas "Machin a dit que ça avait l'air presque potable".
Flore
Mac OSX + Nightly / Laptop Linux Mint + Nightly / Nightly sur Android
SB
Varan
Messages : 1095
Inscription : 05 mars 2004, 18:38

Message par SB »

Ça marche sous IE (encore que chez moi non mais si tu le dis je te crois) probablement parce que IE se sert de la ligne

Code : Tout sélectionner

<param name="src" value="/songs/Winter.mp3">
donc il a le bon nom de fichier. Fx se sert de la ligne

Code : Tout sélectionner

<object data="yritmo.mid" type="audio/x-midi" height="45" width="300">
donc tu ne peux pas y mettre n'importe quoi et dire ensuite que si ça ne marche pas c'est de la faute de Fx. Essaie un code genre

Code : Tout sélectionner

<object data="/songs/' . $song_title . '" type="audio/xmpeg" width="300" height="45">
<param name="src" value="/songs/' . $song_title . '">
<param name="autostart" value="true" />
<param name="loop" value="false" />
</object>
Invité

Message par Invité »

Flore a écrit :Le fait que "ça marche sous IE" n'est absolument pas un bon critère. Ma question était "L'image est elle sur le net ?" que je complèterai par "Le chemin est il relatif ou genre file:///c:... ?"
Pas "Est-ce que IE a encore fait une connerie de derrière les fagots pour induire l'utilisateur en erreur ?" (parce que celle là de réponse, je la connais, c'est oui à chaque fois).

Il faut de la rigueur quand on fait du développement web (comme pour beaucoup d'autres choses). Alors primo, vérifier que tout est OK à la source et pas "Machin a dit que ça avait l'air presque potable".
Oui, l'image est bien sur le serveur et au bon endroit j'ai vérifié. Et quand je te dis que cela fonctionne avec I.E. et pas avec FireFox, j'en suis sûr. J'ai convertie mon image en .GIF et là tout va bien ?????

Après tests il semblerait que c'est cette image particulièrement qui pose problème. Mais alors pourquoi uniquement avec FF, là ?????

PS : Je te remercie pour tes conseils sur la rigueur (je m'efforce d'être un pauvre informaticien rigoureux depuis bientôt 30 ans)
Flore
Administratrice
Messages : 3567
Inscription : 19 nov. 2003, 23:04

Message par Flore »

Anonymous a écrit :Et quand je te dis que cela fonctionne avec I.E. et pas avec FireFox, j'en suis sûr.
Je suis bien certaine que tu en es sûr. Par contre je crois que ce que tu n'as pas compris c'est qu'on s'en fiche que ça marche avec IE.
Tu n'aurais pas un problème de casse ? Particulièrement dans l'extension ? genre ton image est en .JPG et le code appelle une image.jpg ?
Flore
Mac OSX + Nightly / Laptop Linux Mint + Nightly / Nightly sur Android
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 2 invités