Problème d'interprètation CSS

AndroChristophe · 27/01/2012, 10h38

Bonjour,
Je ne sais pas si je poste mon problème dans la bonne partie.

Voici mon problème
J'ai une application serveur qui génère à la volée des pages HTML, principalement pour des mobiles (Android, iPhone, Windows Phone, BlackBerry).
Mon application marche bien pour tous les navigateur, sauf pour internet explorer mobile du Windows Phone. Je reçois bien la demande de la feuille de css mais le navigateur n'interprète pas les styles.

Voici ma feuille HTML :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width">
		<link rel="stylesheet" href="smartphone.css" type="text/css" />
		<link rel="stylesheet" media="all" href="style1.css" type="text/css" />
		<!--[if lt IEMobile 9]><link rel="stylesheet" href="style1.css" media="screen"><![endif]-->
		<title>Test Windows Phone</title>
 
	</head>
	<body>
		<div id="page">
			<div id="52" class="block">
				<h1 class="title">Mon Titre</h1>
				<p class="text"><a href="www.google.fr" >ICI LIEN</a></p>
				<p class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue,</p>
 
			</div>
		</div>
	</body>
</html>

Au niveau des balises link j'ai trafiquer l'attribut média, les instructions conditionnelles. Ne vous étonnez pas s'il n'y a pas trop de cohérences dans les balises link ^^.

Mon CSS est vraiment pas compliqué :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
#page {
	background-color: #FFB587;
}
 
.element {
	padding-left: 5px;
	padding-right: 5px;
}
 
.title {
	font-family: "Verdana";
	font-size: x-large;
	padding-left: 10px;
	color: #FF0000;
}
 
.description {
	font-family: "Times New Roman";
	font-size: medium;
}
 
.text {
	font-family: "Times New Roman";
	font-size: medium;
}
 
.image {
	text-align: center;
}

Si je mets le style directement dans les balises

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<h1 class="title" style="color:#0000FF">

, là il n'y a pas de problèmes, la couleur de mes titres change bien.

Je ne vois pas d'où le problème peut venir...

Si vous avez une solution, merci de m'en faire part.
Merci d'avance et bon week-end pour ceux qui finissent tôt.

rotrevrep · 27/01/2012, 16h24

bonsoir

je te propose cette balise à insérer dans le HEAD :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<link rel="stylesheet" type="text/css" media="handheld" href="style1.css" />

testé sous windows mobile 6.5 et ie6 mobile, donc ça devrait fonctionner pour toi

AndroChristophe · 27/01/2012, 18h05

Bonsoir,
Merci pour ta réponse, mais malheureusement pour moi ça ne fonctionne pas. Je ne sais pas du tout pourquoi je n'arrive pas à obtenir la mise en page du css via les fichiers.
J'ai cependant trouvé une alternative qui me convient pour le moment. Lorsque je génère mon fichier HTML, au lieu de mettre les balises link avec le nom de la feuille de style. J'ouvre et lis le fichier directement et insère son contenu dans une balise <style> dans mon entête.
Allez savoir pourquoi ça marche comme ça et pas autrement...

Enfin si vous avez d'autres propositions, je suis disposé à tout essayer pour rendre mon code plus joli.

27/01/2012, 16h24	#2
rotrevrep Membre Expert yannick inizan Secrétaire d'état à la procrastination Inscription : février 2011 Messages : 304 Détails du profil Informations personnelles : Nom : yannick inizan Âge : 25 Localisation : France, Cher (Centre) Informations professionnelles : Activité : Secrétaire d'état à la procrastination Secteur : High Tech - Multimédia et Internet Informations forums : Inscription : février 2011 Messages : 304 Points : 1 118 Points : 1 118	bonsoir je te propose cette balise à insérer dans le HEAD : Code html : Sélectionner tout - Visualiser dans une fenêtre à part <link rel="stylesheet" type="text/css" media="handheld" href="style1.css" /> testé sous windows mobile 6.5 et ie6 mobile, donc ça devrait fonctionner pour toi __________________ (marquer un post résolu si vous êtes satisfait de la réponse ) le chat caramail de retour ? :/ http://www.tchats.net/beta.php les projets web en cours sont sur : https://github.com/rotrevrep
	00

27/01/2012, 18h05	#3
AndroChristophe Membre éprouvé Inscription : mars 2011 Messages : 319 Détails du profil Informations forums : Inscription : mars 2011 Messages : 319 Points : 441 Points : 441	Bonsoir, Merci pour ta réponse, mais malheureusement pour moi ça ne fonctionne pas. Je ne sais pas du tout pourquoi je n'arrive pas à obtenir la mise en page du css via les fichiers. J'ai cependant trouvé une alternative qui me convient pour le moment. Lorsque je génère mon fichier HTML, au lieu de mettre les balises link avec le nom de la feuille de style. J'ouvre et lis le fichier directement et insère son contenu dans une balise <style> dans mon entête. Allez savoir pourquoi ça marche comme ça et pas autrement... Enfin si vous avez d'autres propositions, je suis disposé à tout essayer pour rendre mon code plus joli.
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email