Problème de caractères sur iWeb

fimflo

Membre junior
Je reviens sur mon nouveau site... (http://www.artiflo.ch) avec lequel j'ai un souci en page d'accueil. Selon le navigateur utilisé, les caractères du texte en dessous du nom n'apparaissent pas comme je le souhaiterais. Sur Safari pas de problème (tiens donc !) alors qu'avec Firefox par exemple les caractères apparaissent plus étroits (normalement le texte est justifié sous le nom Artiflo). Le caractère utilisé n'est pas reconnu par tous les navigateurs (Gulim), raison pour laquelle je l'ai déjà transformé en image dans tout le site (merci Koeklin). Et ce n'est qu'à cet endroit que cela ne joue pas. J'ai essayé à plusieurs reprises de modifier la taille de l'image, sans succès. Merci pour votre éclairage et bonne journée !
Florence :siffle:
 

AurelienS

Nouveau membre
13 Septembre 2011
3
0
Bonjour,
je vois les mêmes caractères, alignés pareil, dans Safari et Chrome.
Mais en plus quand je regarde en détail, les caractères dont vous parlez (sous Artiflo) sont juste une grande image : ils ne devraient pas apparaître différemment en fonction du navigateur !

 

Johannès

Membre confirmé
27 Novembre 2009
172
7
57
Vendôme
Bloc de code:
<img src="[URL="http://forums.macg.co/view-source:http://www.artiflo.ch/Artiflo/Accueil_files/shapeimage_2.png"]Accueil_files/shapeimage_2.png[/URL]" alt="Créations  en argile polymère Vente directe   Marchés  Ateliers créatifs" style="height: 372px; left: 0px; margin-left: 5px; margin-top: 12px; position: absolute; top: 0px; width: 343px; " />
je décompose pour bien voir le style appliqué à cette image

Bloc de code:
<img 
src="Accueil_files/shapeimage_2.png" 
alt="Créations  en argile polymère Vente directe   Marchés  Ateliers créatifs"
style="
height: 372px;  width: 343px;
left: 0px; margin-left: 5px; 
margin-top: 12px;  top: 0px;
position: absolute;" 
/>
contradictions :
marge left 0 ou 5px ?
marge top 0 ou 12px ?
comment il fait le navigateur ??? cela vient peut-être de là
Bloc de code:
left: 0px; margin-left: 5px; 
margin-top: 12px;  top: 0px;
supprime donc left:0 et top:0 pour voir
 

fimflo

Membre junior
"supprime donc left:0 et top:0 pour voir" : merci pour le conseil, par contre je ne trouve pas à quel endroit cela se trouve dans l'inspecteur...
dans le message reçu par mail,tu notes aussi "et dans l'attribut alt de l'image enlève les
qui ne correspond à rien de connu ce sera plus propre" : j'enlève quoi, et par quel chemin encore une fois ? Merci !
 

Johannès

Membre confirmé
27 Novembre 2009
172
7
57
Vendôme
je ne connais pas iweb mais il me semblait qu'on pouvait éditer le code source ou les css quand même.


oui, top est margin-top ne sont pas vraiment la même chose mais pour ma part je ne l'utilise jamais en même temps car c'est source de conflit suivant les navigateurs.

- "top" positionne un élément un élément avec une utilisation de la propriété "position" par rapport à l'élément parent
- "margin-top" positionne un élément par rapport à la distance externe de l'élément parent.

Maintenant si on ne teste pas en commençant par là, d'où viens la différence ???


---------- Nouveau message ajouté à 13h29 ---------- Le message précédent a été envoyé à 13h27 ----------

Il y a une différence entre top et margin-top, l'un est la position de l'élément, l'autre l'habillage du texte autour de celui-ci. Le navigateur saura faire la différence entre les deux.

Pour faire un test, remplacer top par margin-top ici :
http://w3schools.com/css/tryit.asp?filename=trycss_position_top
oui mais si tu enlèves la position "absolute" :coucou: