28172 sujets

CSS et mise en forme, CSS3

Font-size et firefox 14

Bonjour a tous,

Voila ce week-end j'installe sur mon galaxy not, la dernier version de firefox 14, et j'ai la surprise de découvrir qu'il modifie les tailles de textes sur mon site, mais de facon...? aléatoire?

En clair il y a certain bloc qui grossise et d'autre pas.

Du coup je cherche mais je n'y comprend rien.
Genre si je met le meme style dans un fichier css, ou directement dans le code html, il ne m'affiche pas la meme chose.

j'ai fais plein de test mais je ne comprend rien.

Autre test
.test {font-size: 13px;}


<div class="test">test</div>
<div class="test">longue texte de test longue texte de test longue texte de test longue texte de test </div>

La premiere div est écrite en 13 la deuxième en beaucoup plus gros???

ou encore
      <p style="height: 40px;" style="font-size:12px">
long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte 
</p>
<br/><br/><br/>
<p style="font-size:12px">
long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte long texte 
</p>

La premiere est écrite en douze, la deuxieme en beaucoup plus gros?

Quelqu'un aurait il une piste?
Modifié par gotcha5832 (04 Jul 2012 - 13:12)
à première vue aucune idée.

Est-ce que tu constates la même chose avec un html en dehors de ton site ? Juste en test pour vérifier.
Il y a peut-être un conflit ?

Ton site à une adresse ?
Le code montré n'explique pas le problème.
Donc effectivement il faudrait voir la page ou une page qui présente ce problème.

Tu as vérifié avec Firebug qu'aucun autre style ne s'applique à ton texte?
Hello,

Ca ne viendrais pas du text-size-adjust? Cette propriété non-standard est supportée depuis Firefox 11. Elle permet au navigateur d'adapter la taille du texte automatiquement.

Essaie donc avec :

div{
    -moz-text-size-adjust: none;
}


Compatible aussi dans Webkit et IE avec préfixes.
Merci @vdo93

ca viens bien de 
-moz-text-size-adjust: none;


ca à tout résolut.

Mais je n'y ai pas pensé pas de soucis sous FF11, 12 sous linux et pc.
Le text-size-adjust:none est assez violent, et provoque des bugs sur les navigateurs WebKit desktop (Safari, Chrome). Se renseigner sur le sujet avant de l'utiliser.

De plus, pas de raison que Firefox sur Desktop se mette à adapter la taille du texte automatiquement et aléatoirement.
Question bête: tu as vérifié que tu étais bien sur le niveau de zoom initial?
Je te remercie pour cette info.
J'ai rapidement regarder sur
opera 11.11
iphone 4s safari
ipad safari

je vois pas de bug. de quel bug parle tu?

a écrit :
De plus, pas de raison que Firefox sur Desktop se mette à adapter la taille du texte automatiquement et aléatoirement.

C'est par sur desktop qui adapte mais ff14 android.

Sachant que cette version est critiqué et reconnu buggé

Et oui le zoom est au niveau zero
Donc si je comprend bien le risque c'est qu'il empeche le grossissement de police dans les version desktop lors de zoom?

Du coup j'ai le choix entre cela, entre un probleme sous desktop webkit grande résolution ou FF14?
Ou reconstruire tout mon site.
SNIF!!
Disons que c'est un bug WebKit, donc si tu utilises -moz-text-size-adjust ça n'a pas d'impact.
Une solution intéressante peut être d'utiliser la valeur "100%" plutôt que "none", pour éviter le bug de WebKit. Pour Gecko (Firefox Mobile), la valeur "none" peut être utilisée aussi, mais un "100%" devrait faire l'affaire et limite peut-être le risque d'effets drastiques.

Roger Johansson recommande de déclarer côté HTML:
<meta name="viewport" content="width=device-width, initial-scale=1">

(ou, pour width, la largeur de ton site en pixels si tu n'as pas prévu de Media Queries, et dans ce cas probablement pas de "initial-scale")
et côté CSS:
body {-webkit-text-size-adjust:100%;}

ce qui, adapté pour d'autres navigateurs, pourrait donner:
body {
  -webkit-text-size-adjust:100%;
  -moz-text-size-adjust:100%;
  -ms-text-size-adjust:100%;
  }

En gardant à l'esprit que ce n'est pas une propriété standardisée!
Voir la doc: https://developer.mozilla.org/en/CSS/text-size-adjust
Merci, mais ca ne fonctionne toujours pas dans mon cas.
J'ai trouvé une parade définir un height pour le block "grossit"

Mais ce FF14 me crée pas mal de bug d'affichage non constaté nul par ailleurs. alors comme FF 14 réputé comme buggé je crois que je vais vois si les correctif du navigateur vont corrigé cela.
Sujet clos
Aller à