Espace blanc au sommet de la page

Résolu
Toto -  
bg62 Messages postés 23731 Date d'inscription   Statut Modérateur Dernière intervention   -
Bonjour,
j'ai créé une page basique avec XHTML mais un tout petit peu de CSS (pas encore terminé). Mais avec les div, je m'aperçois qu'il y a un gros problème : il y a un espace blanc au sommet de la page, mais aussi en bas de la page.

Voici une capture d'écran : http://www.hostingpics.net/viewer.php?id=536612Capture.png.

Que dois-je faire en CSS pour enlever cette marge ?

Cordialement.
A voir également:

8 réponses

Rodolphe_ Messages postés 1498 Date d'inscription   Statut Membre Dernière intervention   285
 
Bonjour,

ce sont les marges du premier h1 et du dernier p que tu vois.

Pour te rendre compte de ce genre de soucis, tu peux utiliser firebug pour firefox.
1
Toto
 
D'accord, mais il y a-t-il une astuce CSS pour éliminer cette marge ?
0
theshadoo Messages postés 786 Date d'inscription   Statut Membre Dernière intervention   123
 
Tu retires les margin en trop des balises cités tout simplement.

les balises html de type block t'ajouteront toujours des marges en plus, c'est conventionnel et logique à la base. Si on regarde une structure de document, pour la mise en page il faut bien aérer les titres des paragraphes.
0
Toto
 
"Tu retires les margin en trop des balises cités tout simplement. " : c'est-à dire ?

Désolé, je suis encore assez débutant en CSS...
0
theshadoo Messages postés 786 Date d'inscription   Statut Membre Dernière intervention   123
 
#entete h1 { margin: 0;} dans ta première div d'entete

#sidebar h1 { margin-top: 0 }

mais vue qu'il n'y a pas de mise en page je doute que cela soit ces balises que tu désires ciblé, car ta sidebar logiquement si elle s'appelle sidebar c'est qu'elle est dans le corps de la div concerné de ton site.

si c'est vraiment dans le header et le footer de ta page alors pour le footer c'est :
Ta dernière balise <p> où il faudra enlever le margin-bottom: 0
0
Toto
 
J'ai testé, et effectivement, la marge a diminué, mais n'a pas disparu. Je suppose qu'il va falloir faire une illusion avec le background de la page, non ?
0
creadiff Messages postés 445 Date d'inscription   Statut Membre Dernière intervention   57
 
C'est difficile à dire quand on ne voit pas le résultat dans son contexte réel... Existe-t-il une version en ligne que l'on pourrait consulter ?
0
bg62 Messages postés 23731 Date d'inscription   Statut Modérateur Dernière intervention   2 409
 
donne le lien sous la forme "www.monsite.ici" sans les http : //
là on pourra te répondre :)
@+
0
theshadoo Messages postés 786 Date d'inscription   Statut Membre Dernière intervention   123
 
lool en plus ton screenshot est vraiment pas parlant ! on voit tout un tas de ligne qui ne ressemble à rien et on ne sait même pas où se situe ton navigateur....

regarde tes margin dans ton css c'est certainement ca qui merde (tes margins sur les balises principales)
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
bg62 Messages postés 23731 Date d'inscription   Statut Modérateur Dernière intervention   2 409
 
c'est quoi ce "binzzz" sur le 'capture ' ?
0
Toto
 
Bonjour à tous, et merci de vos réponses.

En fait, la page n'est qu'une simple ébauche, mais on remarque déjà le problème de marge en haut et en bas.

J'ai uploadé les fichiers ici : scout123.net/ebauche.

Cordialement.
0
creadiff Messages postés 445 Date d'inscription   Statut Membre Dernière intervention   57
 
Il est souvent souhaitable de commencer son CSS par un "déformatage", du type :

* {margin:0;padding:0}
0
bg62 Messages postés 23731 Date d'inscription   Statut Modérateur Dernière intervention   2 409
 
pas grand chose dans la css, mais elle est bonne ...
html, body {
margin : 0;
}
#entete h1 {
margin : 0;
}
#container {
width : 1000px;
border-right : 1px solid black;
border-left : 1px solid black;
margin-left : auto;
margin-right : auto;
}
#contenu h1 {
margin-left : 10px;
}
#contenu p {
margin-left : 10px;
}

:)
0