[resolu]Mon site est affreux avec Safari

[Emm']

Tout est dans le sujet sauf l'adresse :

http://www.arjavan.ovh.org

Le logo est monstrueusement grossi. Ai-je une taille à ajouter quelque part ? Ligne 28 ajouter style="" avec une taille ? en %, em ou en px ?

J'ai pas réussi à inséré la capture d'écran que j'ai récupérer (elle n'est pas sur le web & le bouton de zeb demande une adresse)

Avez vous une idée de ce que je peux y faire ?

Je vous demande votre avis, n'ayant pas de mac sous la main, je préfère que mes essais soient ciblés, que je ne dérange pas mes connaissances équipés de mac trop souvent !

Modifié le 17 mars 2007 par Emm'

[Dylav]

Salut Emm'

 

Il me semblait bien que j'avais déjà vu ce site quelque part...

 

Pour montrer une image sur Zébulon, il faut d'abord la faire héberger sur un site spécialisé : regarde dans ce topic, le dernier paragraphe du post, Faire héberger une image.

 

Pour ton logo, je suppose qu'il s'agit de la spirale en haut à gauche. Si tu précises ses dimensions, même Safari (que je ne connais pas) devrait les respecter :

 

<img id="logo" src="images/logo3.4.gif" width="90" height="85" alt="logo" title="logo Arjavan" />

Les navigateurs savent en général reconnaître automatiquement les dimensions des images, et en tenir compte dans le calcul de leur mise en page. La littérature conseille cependant de toujours préciser ces dimensions : c'est autant de calculs en moins pour le navigateur, donc une plus grande rapidité à l'affichage.

 

Il semblerait que Safari te fasse une petite faiblesse, et l'indication des dimensions de l'image devrait le contraindre à réagir comme tu le souhaites...

[KewlCat]

Safari / WebKit / KHTML / Konqueror sont de la même famille, donc logiquement avec une machine virtuelle (VMWare, Qemu, etc.) sous Linux tu dois pouvoir tester les réactions de ton site dans Konqueror - ou le navigateur fourni avec KDE4)

 

Concernant les tailles des images, effectivement il ne faut pas supposer qu'elles vont se redimensionner toutes seules à la taille max qu'elles peuvent occuper dans leur conteneur, ce serait oublier le principe de l'overflow. Il faut donc spécifier les attributs CSS "width" et "height" (de préférence en CSS, parce que les attributs de la balise img ne sont pas forcément supportés dans toutes les variantes de HTML / XHTML)

[Emm']

Merci de vos réponses... Il me reste qu'à m'y mettre !

Je vous tiendrais au courant !

 

Dylav, un peu compliqué d'insérer une image !

 

Pour info Kewlcat, je viens de faire un essai avec Konqueror (que je viens d'installer) et ça passe sans rectification... Il doit y avoir des façon de faire différentes entre Konqueror & Safari.

Modifié le 7 mars 2007 par Emm'

[Dylav]

Dylav, un peu compliqué d'insérer une image !

Tout de suite, tu exagères... alors qu'il suffit de 5 ou 6 clics !

La première fois, tu peines un peu, mais tu verras, ça vient vite

[Emm']

Hello Dylava & les autres !

Tout de suite, tu exagères... alors qu'il suffit de 5 ou 6 clics !

La première fois, tu peines un peu, mais tu verras, ça vient vite icon_wink.gif

Des fois je suis faignant !

 

J'ai fait la modif. Je ne sais pas ce que ça donne sur Safari. J'aurais le retour dans quelques jours.

Par contre pour info, avec : width="90" height="85"

c'est impec sous firefox, Konqueror, épiphany, IE, mais sous opéra mon logo disparait, évaporé. Quand je laisse que width="90" : idem, si je laisse height="85" ça marche aussi avec opéra ...

Dés que j'ai la réponse Safari, j'indique résolu of course !

a +

[Dylav]

Pour les dimensions 90x85, il est logique que les résultats te satisfassent, puisqu'il s'agit des dimensions réelles de ton image. Mais souviens-toi de la remarque de KewlCat, et préfère exprimer les dimensions dans la feuille de style, grâce à l'id que tu as attribué à l'image.

 

<style type="text/css">
#logo {width:90px;height:85px;}
</style>

Essaie ainsi avec Opéra, puis ne garde que l'attribut height si ça coince toujours. Le fait de ne fournir qu'une dimension suffit à fixer la taille de l'image, puisque le navigateur conserve la proportion entre largeur et hauteur (sauf si tu le forces, par exemple en lui imposant 135x85 pour étirer l'image en largeur).

[Emm']

Bon sang mais c'est bien sur

J'ai pas encore les reflexes !!

Effectivement, ça marche impec.

[Emm']

La suite avec verifications sur Safari.... :

Autrement dit : j'ai rectifié mon css, via ftp, j'ai mis la nouvelle version en ligne :

1. ça ne change rien,

2. quand je consulte (via l'extansion web developer de Firefox) mon css en ligne, je n'ai pas les lignes ajoutées (width="90"; height="85"; dans #logo). J'ai fait plusierus manip' : écraser mon fichier de css par le nouveau, puis je l'ai éffacé pour installer le nouveau. rien à faire !!! Mon fichier style.css en ligne n'a pas les tailles width et height....

 

Bizarre, non ?

[Nemes]

Salut,

 

Tu as vidé le cache sur safari?

 

Cordialement.