28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

Je viens vous trouver pour un petit problème que j'ai rencontré.

Il n'est pas si grave mais cela pose des contraintes et des limites à mon travail.

Donc voila, en fait je n'arrive pas à faire avaler la police Optima à IE.

J'ai défini une seule fois la police dans ma CSS :

html
{
font-family: Verdana;
font-size: 11px;
line-height: 20px;
letter-spacing: 0px;
background: #ffffff url(img/topbody.png) repeat-x;
}

puisque je n'utilise qu'une seule famille de police sur mon site. Les titres, tout ça, sont en images.

Cela marche très bien avec Safari et firefox sous mac.
Verdana est bien prise en charge aussi sous IE sous win, mais dès que je passe à Optima, IE ne prend plus.

Voila.
Donc pour le moment je colle du verdana. lol

Une idée?

En vous remerciant par avance et en restant à votre dispo si vous avez besoin d'infos supplémentaires pour m'aider.
Bonjour wig0, et bienvenue sur ce forum.

D'une manière générale, il faut que la police déclaré dans ton css soit installée sur le système du client pour être utilisable.
L'affichage ne dépend pas du navigateur.
Il est préférable de ne pas utiliser de police "exotiques" autrement qu'en image.
En faisant une recherche sur ce forum tu trouveras des explications complémentaires et des solutions.
Vui, merci pour l'accueil.

Ben en fait il y a juste que j'ai vu Optima sur un autre site et qu'elle s'affichait correctement avec IE sur le même ordi tout ça tout ça.

Je vais tenter la recherche, merci quand même.
wig0 a écrit :
Ben en fait il y a juste que j'ai vu Optima sur un autre site et qu'elle s'affichait correctement avec IE sur le même ordi tout ça tout ça.

Deux choses à faire:

1. Vérifier qu'Optima est bien installée sur le système qui fait tourner l'Internet Explorer en question.
2. Aller voir sur le site dont tu parles de quelle manière la fonte Optima est appelée (dans la feuille de styles notamment).
Apparemment la font est installée puisque l'autre site (c'est 1dcafe) l'affiche sous IE/windows (Virtual Pc, mais même).

J'ai essayé de regarder le code source justement.
J'ai vu.

Il y a des class dans tous les sens.
Mais sinon, à moins que j'ai mal vu, tout est appelé normalement avec : font-family : truc muche.

Mais il y en a vraiment dans tous les sens et il y a que j'ai fait le choix de conserver un code source simple, le plus minimal possible.

Cela fonctionne sous osX mais pas sous win.
D'ailleurs je viens de vérifier avec firefox sous win et ça ne passe pas non plus.

Alors, peut-être que je me suis trompée, peut-être qu'il ne s'agit pas de la font Optima sur 1decafe ?!

Pourtant cela il ressemble fortement.

Si je ne trouve pas de résolution à ce problème, ce ne sera pas grave, j'utiliserai Verdana. C'est une police qui reste classy Smiley cligne .
Mais j'adore Optima... alors.
Mais je sacrifierai pas mon code juste pour ça lol, puisque j'ai trouvé une petite alternative en utilisant verdana.
Mais bon... j'aurai aimé employer Optima sur certains de mes designs.

Si quelqu'un de vous a Safari, firefox et IE sous win (je ne l'ai pas encore récupéré je vais le faire mais sous VPC c'est un peu long) pourrait il me dire si il voit de l'optima sur cette maquette ? Dans la partie texte plus particulièrement.

http://www.gingzhiloid.net/sahara/

Désolée, je ne souhaite pas faire de pub pour le site, c'est vraiment pour savoir quoi faire. Si quelque chose à faire il y a.
D'autant plus que la maquette et le site en question sont en construction et je ne suis pas certaine que tout le monde obtienne le même rendu.
Donc c'est pas a mon avantage. Voila.

Merci à ceux et celles qui ont tenté de me répondre déjà.
Merci d'avance aux autres.
Modifié par wig0 (05 Oct 2008 - 13:37)
Bon n'étant vraiment pas certaine que la police soit Optima sous IE, je vous l'envoie en screenshot telle que je la vois sur IE8 Avec VPC :

Le titre a vraiment l'air d'être en optima mais pour le texte j'ai un gros doute et comme je vous le disais dans leur code il y en a dans tous les sens.

upload/18102-Image8.png



Et voici comment cela apparait sous safari OSX

upload/18102-Image9.png
Modifié par wig0 (05 Oct 2008 - 13:53)
Chez moi, Je n'ai pas la police "optima" installé. Ni sous linux, ni sous windows.

Pour afficher ton site, mon navigateur va utiliser la police par défaut que j'ai défini.
du times (par défaut ou par exemple) oui ... je sais ...

Là est mon problème.

Mais c'est bien de l'optima que vous voyez sur le premier screenshot ?


Conclusion : les OS manquent de polices préinstallées.
Non ?


Sous OSx on a tout. Apparemment.


Par ailleurs en effet si la police n'est pas installée chez toi, ça ne risque pas de fonctionner Smiley cligne
Modifié par wig0 (05 Oct 2008 - 15:33)
je ne sais plus à quel saint me vouer

upload/18102-Image10.jpg

Safari/Win affiche une police par defaut aussi.

Je rappelle pour les futurs lecteurs que la police du texte du screenshot ci dessus devrait être en Optima.

Et elle s'affiche en times.

Donc il y a plusieurs chose possibles ...


Voila, bon sans réponse, je vais repasser tout ça en Verdana.


upload/18102-Image11.jpg
Modifié par wig0 (05 Oct 2008 - 16:17)
Avec safari osx :



upload/18102-Image13.jpg

On voit pas trop bien, mais suffisamment.
Modifié par wig0 (05 Oct 2008 - 16:29)
Oh ca va j'ai pas repris grand chose de dave shea...


lol Smiley cligne
Modifié par wig0 (05 Oct 2008 - 16:33)
Bon, remettons un peu d'ordre là-dedans:

1. Tu dois apprendre à utiliser la propriété font-family correctement. En général, on applique sur l'élément BODY un font-family avec pour valeur une suite de polices, et pour finir un nom de police générique. Ce qui peut donner:
body {
	font-family: Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
}

Un navigateur cherchera d'abord à utiliser Verdana, puis Bitstream Vera Sans, puis Lucida Grande, et en dernier recours il utilisera la police par défaut pour la famille générique "sans-serif" (configurable par l'utilisateur dans les préférences du navigateur).

Tu remarqueras que dans le liste ci-dessus, on n'a utilisé que des fontes qui sont assez proches à la fois graphiquement et surtout en termes de volume occupé par les caractères.

2. Optima est installé par défaut avec Mac OS X... et pas installée par défaut avec les autres systèmes, ni distribuée avec des logiciels relativement répandus. En conséquence, Optima est une police disponible chez 3 à 5% des internautes. Conclusion: ne pas l'utiliser, ou bien l'utiliser en premier choix en prenant bien soin d'avoir placé une police plus «standard» et d'aspect proche en second choix.

3. Le site 1dcafé utilise justement une liste très complète de fontes. Je ne sais pas si au final le Windows que tu as utilisé pour les tests a Optima d'installée, ou bien si c'est une fonte telle que MgOpen Cosmetica qui est utilisée en remplacement. Quelque soit l'explication exacte, d'après Code Style (Web Fonts Survey) Optima est installée sur 87% des Macs et... 3% des systèmes Windows.
Florent V. a écrit :
En général, on applique sur l'élément BODY un font-family avec pour valeur une suite de polices, et pour finir un nom de police générique. Ce qui peut donner:
body {
	font-family: Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
}

Un navigateur cherchera d'abord à utiliser Verdana, puis Bitstream Vera Sans, puis Lucida Grande, et en dernier recours il utilisera la police par défaut pour la famille générique "sans-serif" (configurable par l'utilisateur dans les préférences du navigateur).




Ui... ça je le sais.


Donc c'est autre chose.


Oki, merci pour les contributions, pas de soluce donc pour le moment.
wig0 a écrit :



Ui... ça je le sais.


Il faut donc l'utiliser Smiley cligne

a écrit :

Donc c'est autre chose.


Non, simplement la police que tu souhaites utiliser est disponible chez une minorité d'utilisateurs. Il n'y a rien à faire pour y remédier à part utiliser des polices proches pour les os qui n'en disposent pas.