1485 sujets

Web Mobile et responsive web design

Salut,

J'ai lu les différents sujets concernant la gestion de la taille de texte et le responsive.

En partant de cette base :
html {font-size: 100%;} 
body {font-size: .8em;}


citée ici en exemple:
http://www.alsacreations.com/article/lire/563-gerer-la-taille-du-texte-avec-les-em.html

Je met ensuite dans mon site, les taille en rem
par ex
h1{
font-size:2rem;
}


Pour le responsive
je cible avec
@media...{
    body{font-size: 3em;}   
}


=> la taille du conteneur augmente, comme si il attendait bien une police de 2rem sur la base de 3em
mais la police elle ne change pas.

mais si je change pour h1 la taille de rem en em

h1{
font-size:2em;
}


la poilice s'adapte bien, mais je perd l'utilité de l'unité rem

J'ai remarqué qu'en cilblant non plus la balise body mais la balise html avec les media queries, alors la font-size s'adapte bien avec les rem


@media...{
    html{font-size: 3em;}   
}

la police change bien.

Je pensais avoir compris la différence em, rem mais comment faut il appliquer ça pour le responsive.

Dans le lien situé plus haut il est marqué :
"ce font-size: 100% sur l'élément html, alors que cela devrait être inutile ? Il s'agit en fait d'un correctif pour un bug d'Internet Explorer Windows"

pourtant il semble indispensable pour utilisé l'unité de mesure rem

Bref je me noie Smiley eek