Цвет фона CSS не распространяется на край экрана

Question

Я пытаюсь создать приложение, но по какой-то причине я не могу сделать фон одного из моих классов расширенным до края экрана.

Я сделал скрипку, чтобы показать это: http://jsfiddle.net/Hydropotamus/krevheyc/

Я думаю, что проблема в этом классе:

.moving-background { 
    left:-10%; 
    padding-top:130px; 
    padding-bottom:20px; 
    padding-right:20px; 
    padding-left:20px; 
    width:100%; 
    background-color:#00a221; 

} 

Как вы можете видеть на скрипке, цвет фона не распространяется на край экрана, и я не уверен, как двигаться вперед с этим.

Я также попытался переключить прокладку и поля, но я не могу понять, где я иду не так.

Answer 1

Убедитесь, что запас из тела устанавливается на 0.

body { 
    margin: 0; 
} 

Answer 2

запас 8px в организме является причиной этого. Некоторые из css являются whacky, но вы также можете добавить margin-left: -8px, если хотите просто изменить эту область и не повлиять на других.

.moving-background { 
    margin-left: 8px; 
} 

также причина, по которой верхний зеленый раздел не имеет, что разрыв происходит потому, что позиция является фиксированной и левый равен 0% (должен только быть 0);

Answer 3

В вашем CSS добавьте это:

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

Различные браузеры используют различные поля и отступы по умолчанию для страницы; лучше всего их указать.

Answer 4

Оказалось, что этот элемент находился в контейнере с некоторым дополнением, которое я не заметил. Мне пришлось удалить эту прокладку, а затем она смогла работать. тем не менее, я действительно пытался использовать ваши решения в скрипке, и это действительно так помогло!