Bonjour !
 
Je débute en CSS et suis en train de construire un site pour un association.
 
Mon problème:

 
Le div centre se place sous mon header et à droite du menu gauche.  
 
Sous IE tout s'affiche bien. Mais sous FF il met une marge de 15px entre le header et le div centre quand mon html est ceci:

 
Où est l'erreur (bug de FF ? Pas possible) ? Merci d'avance !

il est où le header ?

Ben évidemment, si tu met  margin-top:15px; dans le div class="texte", il va te mettre 15px de marge

Dans le css:

Ensuite je l'utilise comme ça dans mon html:

C'est bizarre comme méthode ?
 
Merci !

Ben comme dit, tu as donné une marge à ton div, c'est normal que FF y mette une marge, non ?

Il devrait mettre 15px de margin-top par rapport à mon conteneur texte, non par rapport à mon header. J'ai une bande blanche entre mon header et mon div centre... C'est là le problème !

Ca s'appelle du margin-collapse. Met un padding à la place.

 
Oui, les gens normaux ne mettent pas un header vide, ils mettent un header avec du contenu (texte habituellement) qu'ils remplacent par leur image/header via CSS, ce qui permet aux navigateurs textuels et aux crawlers (googlebot par exemple) de "voir" correctement les infos de la page

Merci ça marche .
 
C'est quoi la différence entre padding et margin alors

Tu as un exemple ?

Padding, c'est une marge interne, et margin c'est externe. On a, dans l'ordre :
 
margin - border - padding - content

Merci

J'y ai pensé mais dans l'image de fond de mon header il y a un texte avec ombres et lueurs fait dans Photoshop. Ca donne mieux qu'avec un texte remis en forme par CSS.
 
Il y a une autre méthode ? Exemples ?

http://www.csszengarden.com/ tout simplement
 
dans le div d'id "pageHeader", on trouve le titre de la page dans un h1 et le sous titre dans un h2, quasiment toutes les CSS de CSSZG les remplacent par une/des image(s) (et font de même avec les titres de paragraphes) et dans tous les CSS on peut trouver la ligne
 

qui pointe vers cet article (long et en anglais, mais à lire en entier)
 
La méthode de base est le Fahrner Image Replacement (FIR)
on trouve également des variantes (mentionnées en fin d'article) telles que le Leahy/Langridge Image Replacement (LIR), le Rundle’s Text-Indent Method et le Cover-up Method.
 
et un article de Dave Shea (fondateur de CSSZenGarden) en faveur du FIR:

t'as pas compris tout le principe.
 
le but n'est pas d'enlever l'image, mais d'avoir une information textuelle remplacée par la même information sous forme d'image via CSS, de manière à ce que les gens n'ayant pas accès aux images ou CSS ne perdent rien.

Génial merci du lien et du conseil. Quasiment tout lu et je mets en application, le résultat est pas mal du tout
 
J'aimerais juste comprendre comment faire correctement un menu avec rollover qui passe bien même sans style CSS. Ces li, ul c'estun peu du chinois

un menu avec rollover genre les objets qui changent de couleur toussa?
(parce que les menus déroulants pur CSS MSIE ne les gère pas)
 
http://css.maxdesign.com.au/listamatic/

Aaah excellent  

Comprends pas ce qui se passe ici. Sur une page j'ai un menu de 50px de haut, dans mon div centre. Du coup j'ai crée un nouveau div texte2, comme le div texte, avec un padding-top de 65px.

Mon premier titre, une image (FIR, quand tu nous tiens ), s'affiche néanmoins en dessous de mon menu... et ce uniquement sous IE ! Sous FF l'affichage est impec.
 
Que changer pour que ça passe sous IE ?
 
Edit: Le problème venait du div contenant mon menu horizontal, moins large que le conteneur centre, c'est résolu .
 
Maintenant pourquoi le résultat était différent sur FF et IE