28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je me permet de vous solliciter car je n'arrive pas à trouver une anomalie d'affichage de balise h1 avec une taille de police exprimé en em.

En effet la balise h1 sous safari mobile devient plus petite que le reste du texte alors que je lui attribué une taille supérieure (1.1em) par rapport au reste du texte présent sur la page (1em).

La balise en question apparaît çi-dessous en rouge :

Sous Safari (IOS)
http://hauwel.johan.free.fr/img/anomalie-h1.jpg

Sous Chrome (PC Windows)
http://hauwel.johan.free.fr/img/anomalie-h1-2.jpg

Le code :


<div id="page">
	<div id="logo"> [...] </div>
	<div id="menu-droite"> [...] </div>
	<div id="contenu">
		<h1>Morin Férec SARL (76) spécialiste en couverture, plomberie et chauffage</h1>
		<p>[...]</p>
	</div>
</div>



body {
  margin:0px;
  padding:0px;
  font-size: 1em;
  width:100%;
  height:100%;
  min-height:900px;
  min-width: 1024px;
}

#page {
	width: 70%;
	height: 100%;
	min-width: 1024px;
	min-height: 900px;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
	background-image: url(../img/ciel.jpg);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	overflow: auto;
	font-size: 1em;
}

#contenu {
	clear: both;
	position: relative;
	width: 65%;
	margin-left: auto;
	margin-right: auto;	
	margin-top: 2%;  
	background-color: transparent;	
	background-image: url(../img/ecran.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;	
	padding: 1% 1% 6% 1%;
	text-align: center;
	font-family:"Exo";
	font-size: 1em;
}

h1 { /* Suppression du rendu par défaut du h1 */
	display: block;
	font-size: 1.1em;
	color: #CC1F26;
	font-weight: normal;
	margin: 0 0 1em 0;
}

p { /* Suppression du rendu par défaut du p */
	font-size: 1em;
	font-weight: normal;
	margin: 0;
	padding:0;
}


Merci d'avance si vous trouvez une solution...
Modifié par aroweb (20 Feb 2015 - 22:24)
Administrateur
Bonjour et bienvenue, Smiley smile

ce n'est pas le reste du texte qui est à 1em mais #page et #contenu.
Rien n'est fixé pour les éléments p au niveau du font-size, du coup peut-être que... Est-ce que préciser une valeur sur p change quelque chose ?
Merci de votre réponse... Smiley smile

Non malheureusement j'avais également fixé les balise p à 1em, j'ai complété le code çi-dessus avec la portion de code manquante.
Modifié par aroweb (20 Feb 2015 - 22:23)