Как избавиться от пробелов между разделами CSS/HTML

Question

Я новичок в веб-дизайне и столкнулся с этой проблемой; У меня есть два раздела, каждый раздел с его выигранным фоновым изображением. Однако первое фоновое изображение не заканчивается сразу после предыдущего фонового изображения. Вместо этого между двумя изображениями есть пробелы, которые выглядят отвратительными.

Это 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

Я не уверен, но, возможно, вы ищете CSS Reset?

Просто напишите * { margin: 0; padding: 0; } в верхней части кода css. Иначе, если у вас есть другие проблемы с пробелами с встроенными элементами, их можно исправить с помощью font-size: 0; на контейнере затронутых элементов.

Answer 2

Добавьте это в CSS:

*{ 
    padding: 0; 
    margin: 0; 
} 

Устанавливает поля и отступы всех элементов, равных нулю.

Answer 3

Также Вы можете держать запас hx и p элементов в секции по

1. установив границу с первым ребенком дел. Borders

   section>div { border:1px solid transparent }

2. или padding будет делать:

   section div { padding:1px; }

Чтобы понять, что происходит, вы можете прочитать this article.