Comment se débarrasser des espaces entre les sections CSS/HTML

Question

Je suis nouveau à la conception de sites Web et j'ai rencontré ce problème; J'ai deux sections, chaque section avec son image de fond gagnée. Cependant, la première image d'arrière-plan ne se termine pas juste après l'image d'arrière-plan précédente. Au lieu de cela, il y a un espace entre les deux images qui semble hideux.

C'est le jsFiddle: http://jsfiddle.net/M26Ge/

CSS:

#slide-1 .bcg { 
    background-image:url('http://upload.wikimedia.org/wikipedia/commons/1/15/Hopwas_Woods_Sun.jpg'); 
    background-position: center center; 
    background-repeat: no-repeat; 
    background-attachment: fixed; 
    background-size: cover; 
    height: 800px; 
    width: 100%; 
} 
#slide-2 .bcg{ 
    background-image:url('http://i953.photobucket.com/albums/ae11/Kronstadt/Shabby-Princess-Kristie_SF_StripedP.jpg'); 
    background-position: center center; 
    background-repeat: repeat; 
    background-attachment: fixed; 
    background-size: cover; 
    height: 100%; 
    width: 100%; 
} 

Answer 1

Je ne suis pas sûr, mais cherche CSS Reset peut-être êtes-vous?

Il suffit d'écrire * { margin: 0; padding: 0; } en haut du code CSS. Sinon, si vous rencontrez d'autres problèmes d'espaces avec des éléments en ligne, vous pouvez les corriger en utilisant font-size: 0; sur le conteneur des éléments affectés.

Answer 2

Ajouter à votre CSS:

*{ 
    padding: 0; 
    margin: 0; 
} 

Ceci définit la marge et le rembourrage de tous les éléments égaux à zéro.

Answer 3

Vous pouvez ainsi maintenir la marge de hx et p éléments dans la section par

1. fixer une frontière au premier div enfant. Borders

   section>div { border:1px solid transparent }

2. ou padding fera:

   section div { padding:1px; }

Pour comprendre ce qui se passe, vous pouvez lire this article.