{Resolu] Mon CSS foire sous Firefox et pas sous IE

Salut tout le monde,

Oui, je suis un petit nouveau dans ce monde du css. je savasi avant faire quelques petites choses simples, mais depuis je me suis dis qu'il fallait que je me mette vraiment à son utilisation, notement pour pouvoir faire une V4 de mon site www.GPlayS.com qui soit un peu plus "pro" et moins gourmande face à une constante évolution de son public.

Je ne suis pas seul sur ce projet, bien sûr. J'ai un développeur avec moi qui s'occupe surtout des fonctions et de la BDD. De mon coté, je m'occupe du design, et de l'administration, enfin on s'entend super bien quoi

Comme j'ai toujours rêvé d'avoir moin petit journal sur le net, j'ai donc décidé aussi de faire mon blog basé sur dotclear, et donc de me faire les mimines pour GPlayS.. C'est un système vraiment cool ce blog, sauf que j'ai un probleme avec la galerie qui ne veut pas changer de repertoire, et qui me remet quelques soit la config de dotclear toujours sur le repertoire "ecrire". Enfin bon, bref, passons.

En fait, je veux créer mon petit skin pour mon petit dotclear. j'ai donc installé une copie sous easyphp en local. Jusqu'ici tout va bien.

Maintenant, j'ai commencé ma feuille de style, elle donne ceci en partie :

#conteneur {
position: absolute;
width: 750px;
left: 50%;
margin-left: -375px;
background-color:#EAE595;
}

#header {
	background-image: url(images/header.png);
	height: 120px;
	border: 3px solid #999;
}

#webtitle {
	height: 30px;
	background-image: url(images/barre1.png);
	background-repeat: repeat-x;
	
}

.title {
	font-family: "Times New Roman", Times, serif;
	font-size: 14px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	color: #0000CC;
	text-decoration: none;
	text-align: left;
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 10px;
}

Mon fichier html donne ceci :

<div id="conteneur">
	<div id="header"></div>
	<div id="webtitle">
		<p class="title">Le Petit Journal de Wildry</p>
	</div>
</div>

Le resultat ne montre aucune faille sous IE, mais sous Firefox, j'ai un espace entre le bloc "header" et le bloc "webtitle". je ne vois pas du tout d'où ca peut venir.

HELP
Modifié le 16 Jan 2005 - 21:12

Tu as essayé de mettre les marges de "header" et "webtitle" à 0 ?

J'ai rajouté margin: 0px; à "webtitle" et à "header" mais sans succès. Le résultat est identique.
Modifié le 10 Jan 2005 - 20:38

J'ai trouvé !
Wao, fallait le savoir !

En fait, il fallait mettre une marge à la balise p comme ceci :
p {
margin: 0px;
}

et voilà, plus de bug !

pfff
(Si ca peut servir à qqn, enfin à un débutant comme moi...)
Modifié le 10 Jan 2005 - 21:07

Wildry a écrit :

et voilà, plus de bug !

pfff
(Si ca peut servir à qqn, enfin à un débutant comme moi...)

Salut !
Justement, pour que ça puisse servir aux autres, je t'invite comme le veut l'habitude, à éditer le titre de ton post et à y rajouter un [Résolu]
Merci d'avance

Au fait, si tu avais lu la méthodologie qui se trouve en post-it du salon CSS, tu aurais trouvé la solution à ton problème également

PS : veux-tu bien utiliser les balises [ CODE] pour désigner tes codes HTML et CSS ? Ça facilitera la lecture à tout le monde, comme cela est expliqué dans les Règles du forum... que tu as déjà lu avec avidité je suppose

moi pour éviter des problèmes avec des marges ou des paddings je commence tj par:

* {
margin:0px;
padding:0px
}

Comme ça par défaut tout les éléments non pas des marges ni de padding...
Modifié le 11 Jan 2005 - 14:49

C'est vrai que c'est une idée qu'elle n'est pas mauvaise. Enfin depuis j'ai revu ma copie de mon skin de dotclear et j'avoue que je commence a en etre fier. J'espère pouvoir le mettre prochainement en ligne, mais bon, je travaille à la main et plutot doucement.

gagarine a écrit :
moi pour éviter des problèmes avec des marges ou des paddings je commence tj par:

* {
margin:0px;
padding:0px
}

Comme ça par défaut tout les éléments non pas des marges ni de padding...

Oui ... cf la Méthodologie évoquée dans le post juste au-dessus