28173 sujets

CSS et mise en forme, CSS3

[Résolu] Problème avec l'attribut <div style=""> sous

Bonjour,

j'ai une truc bizarre que je n'arrive pas à résoudre...
Pour des effectuer des effets slide sur des élèments, je dois cacher certains <div> avec le style dans l'HTML et pas dans le feuille de style :
<div style="display:none;">...</div>


Or sous Firefox, aucun des <div> ne se cachent ! alors que sous IE ça fonctionne...
J'ai bien vérifier s'il n'y avait pas d'interférence CSS... mais tout semble normal. Smiley ohwell
Une idée ?

J'essayerai de fournir un visuel si besoin (mais faudra faire la poussière pour être présentable... Smiley smile )

Merci d'avance.... je compte sur vous ! Smiley cligne
Modifié par Tchupacabra (07 Aug 2007 - 18:17)
Bonjour,

Ben normalement, ça marche. Il doit y avoir un problème quelque part en dehors du code que tu présentes. Et pour qu'on t'aide à le dénicher, une seule solution: la page en ligne. Smiley smile
Smiley biggrin ok j'ai trouvé le fautif !

voici le code qui ne fonctionne pas sous Firefox :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/HTML; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/ccs" />

<title>mon titre</title>
<style>
<!--
.visible {
	background-color:#FFCC66;
}
.invisible {
	background-color:#99CC00;
	display:none;
}
-->
</style>
</head>
<body>

<div>

	<div class="visible">
		<p>Lorem ipsum dolor sit amet consectetuer ipsum pede nonummy orci natoque. Ligula ut Nulla cursus metus tortor Curabitur justo turpis natoque Maecenas. Aenean nibh Sed tincidunt tellus a pede mollis Nunc Pellentesque metus. Pellentesque ut pulvinar massa vitae Morbi id feugiat rhoncus malesuada condimentum. Donec Pellentesque tortor natoque tristique fermentum Praesent Proin Curabitur dolor.</p>
		<p>Convallis fermentum Aliquam leo magna venenatis Nullam ut laoreet Vivamus Donec. Odio ipsum lobortis adipiscing Suspendisse Vestibulum aliquam ridiculus montes lacus Morbi. Ante amet tortor ante tellus eu pellentesque sem nibh enim feugiat. Wisi neque wisi consectetuer a sagittis auctor Aliquam lacinia nec Curabitur. Justo vitae Morbi scelerisque ultrices Pellentesque mattis elit Aliquam et eget. Ut.</p>
	</div>
	
	<div style="display:none; background-color:#99CC00">
	<!--<div class="invisible"> -->
		<p>Lorem ipsum dolor sit amet consectetuer ipsum pede nonummy orci natoque. Ligula ut Nulla cursus metus tortor Curabitur justo turpis natoque Maecenas. Aenean nibh Sed tincidunt tellus a pede mollis Nunc Pellentesque metus. Pellentesque ut pulvinar massa vitae Morbi id feugiat rhoncus malesuada condimentum. Donec Pellentesque tortor natoque tristique fermentum Praesent Proin Curabitur dolor.</p>
		<p>Convallis fermentum Aliquam leo magna venenatis Nullam ut laoreet Vivamus Donec. Odio ipsum lobortis adipiscing Suspendisse Vestibulum aliquam ridiculus montes lacus Morbi. Ante amet tortor ante tellus eu pellentesque sem nibh enim feugiat. Wisi neque wisi consectetuer a sagittis auctor Aliquam lacinia nec Curabitur. Justo vitae Morbi scelerisque ultrices Pellentesque mattis elit Aliquam et eget. Ut.</p>
		<p>At Vestibulum dui nibh Suspendisse pellentesque tellus tempus adipiscing natoque lobortis. Eget ac Cum interdum sapien at felis vel faucibus semper Phasellus. Molestie egestas justo vestibulum Vestibulum tincidunt rutrum nunc rutrum ipsum sit. Vel dictum consequat Curabitur elit id laoreet et felis Aenean auctor. Phasellus leo malesuada consequat Quisque Nulla lacus vel Ut.</p>
		<p>A ipsum augue habitasse id Ut leo id morbi vitae egestas. Mus metus Nam interdum Vestibulum penatibus Sed natoque purus risus faucibus. Risus Sed hac mi ridiculus Aenean urna risus Nam Morbi velit. Mollis et In hendrerit hendrerit elit mauris condimentum id arcu fringilla. Tortor nibh Cras a in et rutrum et sagittis urna lacus. Est facilisi ligula.</p>
	</div>

	<div class="visible">
		<p>Lorem ipsum dolor sit amet consectetuer ipsum pede nonummy orci natoque. Ligula ut Nulla cursus metus tortor Curabitur justo turpis natoque Maecenas. Aenean nibh Sed tincidunt tellus a pede mollis Nunc Pellentesque metus. Pellentesque ut pulvinar massa vitae Morbi id feugiat rhoncus malesuada condimentum. Donec Pellentesque tortor natoque tristique fermentum Praesent Proin Curabitur dolor.</p>
		<p>Convallis fermentum Aliquam leo magna venenatis Nullam ut laoreet Vivamus Donec. Odio ipsum lobortis adipiscing Suspendisse Vestibulum aliquam ridiculus montes lacus Morbi. Ante amet tortor ante tellus eu pellentesque sem nibh enim feugiat. Wisi neque wisi consectetuer a sagittis auctor Aliquam lacinia nec Curabitur. Justo vitae Morbi scelerisque ultrices Pellentesque mattis elit Aliquam et eget. Ut.</p>
	</div>

</div>

</body>
</html>
Sous FF, le div central
<div style="display:none; background-color:#99CC00">
ne fonctionne pas alors que si je le remplace par
<div class="invisible">
celui s'efface correctement !

En faite, je viens de m'apercevoir que Firefox interprète différemment que IE (à tort ou à raison, je ne sais pas... vous me le dirais Smiley langue ) la ligne :
<meta http-equiv="Content-Style-Type" content="text/ccs" />


Si je l'enlève tout redevient dans l'ordre... Smiley lol
Mais pourquoi ?
Tchupacabra a écrit :
<meta http-equiv="Content-Style-Type" content="text/ccs" />

Smiley lol

De toute façon, cette ligne est inutile puisque "text/css" est la valeur par défaut (par contre, il n'y a en théorie pas de valeur par défaut pour "Content-Script-Type"). Et même si tu l'utilises, tu dois spécifier l'attribut "type" pour tes éléments "style".
Julien Royer a écrit :
Et même si tu l'utilises, tu dois spécifier l'attribut "type" pour tes éléments "style".

Oui, tout à fait. Ça indique juste quel langage de styles est utilisé via les attributs style. Mais ta mésaventure prouve que c'est efficace, du moins avec certains navigateurs. Firefox ne sait pas gérer le type MIME text/ccs, donc il ignore le contenu des attributs style. Smiley smile

De même, l'indication du "Content-Script-Type" ne permet pas de virer les type="text/javascript" des éléments script.
Modifié par Florent V. (07 Aug 2007 - 16:53)
Sujet clos
Aller à