Как удалить поле в верхней части моей страницы

Я хочу удалить верхний край моей страницы. Я покажу вам, что я имею в виду под скриншотом enter image description here Как удалить поле в верхней части моей страницы

На моем рисунке есть красная стрелка, указывающая на мою проблему. Как я могу удалить эту маржу? я выкладываю здесь мой CSS:

div#header { 
    background-color: #6495ED; 
    background: -moz-linear-gradient(100% 100% 90deg, black, gray); 
    background: -webkit-gradient(linear, center top, center bottom, from(gray), to(black)); 
    margin: 0px; 
    width: 100%; 
} 
body { 
    background-color: #000000; 
    width: 100%; 
    height: 100%; 
    padding: 0; 
    margin: 0; 
} 
h1 { 
    text-align: center; 
    color: #FFFFFF; 
    font-family: sans-serif; 
    font-size: 26px; 
    font-weight: bold; 
    padding: 5px; 
} 
ul { 
    list-style-type: none; 
    padding: 5px; 
} 

li { 
    color: #FFFFFF; 
    font-family: sans-serif; 
} 

p { 
    color: #FFFFFF; 
    font-family: sans-serif; 
    padding: 5px; 
} 
a { 
    text-decoration: none; 
    color: #FFFFFF; 
}

Таким образом, любое предложение о том, как я могу удалить этот край как раз над моей головой?

Здесь вы можете увидеть мой HTML:.

<!DOCTYPE html> 
<html lang="it"> 
    <head> 
     <meta charset="utf-8" /> 
     <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/> 
     <title>Lista coupon</title> 
     <script src="../js/jquery-1.9.1.min.js" type="text/javascript"></script> 
     <script src="../js/memoria.js"   type="text/javascript"></script> 
     <style src="../css/style.css"   type="text/css"></style> 
    </head> 
    <body onload="loadJson();"> 
     <div id="header"> 
      <h1>Lista coupon salvati</h1> 
     </div> 
     <div id="content"> 
      <p>Di seguito trovi tutte le promozioni salvate</p> 
      <div id="list"> 
      </div>   
     </div> 
     <div id="footer"> 

     </div> 
    </body> 
</html>

источник

2013-07-30 lucgian84

Какой у вас HTML-код? – Keith

Вы можете отправить html-код –

Я выложу свой html, извините – lucgian84

Set margin: 0; к элементу <h1>

Демо: http://jsfiddle.net/5w6Es/

Такая же проблема, как с margin-left из <ul> элементов или margin-top/margin-bottom из <p> элементов и т.д.

Вам нужно сбросить свои стили по умолчанию при использовании их на границах вашей страницы.

источник

2013-07-30 12:56:30

Ваше решение работает лучше, чем другие, я буду использовать ваше спасибо! – lucgian84

Вы не говорите, что браузеры его произошедшей в

Если вы используете Firebug и его инструменты должны быть в состоянии увидеть, что является причиной интервал, а затем установить его на ноль, однако, «чит» будет использовать сценарий сброса css, такой как Meyers http://meyerweb.com/eric/tools/css/reset/, чтобы очистить все эти несоответствия браузеров.

источник

2013-07-30 12:48:09 Andiih

Я использую Firefox (движок Gecko) и Chrome/Safari (WebKit) – lucgian84

Попробуйте удалить отступы и поле также для html элемента (не только body)

Попробуйте также удалить запас по умолчанию (по-разному), подаваемый каждый браузер на h1 элемент, который вы не переопределяетесь/сброс и что, вероятно, collapsing над #header элемента

html { 
    margin: 0; 
    padding: 0; 
} 

h1 { 
    ... 
    margin: 0; 
}

источник

2013-07-30 12:49:02 fcalderan

С этим решением он не работает ... – lucgian84

заполните скрипку, воспроизводящую проблему, с вашей реальной разметкой. в любом случае это действительно проблема, связанная с разваливающимся краем вашего основного заголовка: http://www.w3.org/TR/CSS2/box.html#collapsing-margins – fcalderan

'+ 1' Без CSS-элемента nuller заголовки по умолчанию поле, устанавливающее его на «0», является правильным способом. Протестировано и (конечно) работает. –

Необходимо добавить марку: 0px; к этому CSS: http://jsfiddle.net/vv6DL/

h1 { 
    text-align: center; 
    color: #FFFFFF; 
    font-family: sans-serif; 
    font-size: 26px; 
    font-weight: bold; 
    padding: 5px; 
    margin:0px; 
}

источник

2013-07-30 12:56:48 Keith

Try This

h1 
{ 
    margin:0px; 
}

источник

2013-07-30 12:59:14

Лучшему способу я нашел, чтобы сделать это, добавив : первого-ребенок псевдо-элемента в вашем CSS, чтобы ваш первый элемент, такой как <h1> or <ul> и т. д. и т. д. внутри вашего элемента body.

Так пример, используя свой след вверх выше будет

h1:first-child { margin-top: 0; }

Это устраняет мешая все дальнейшие <h1> элементов в коде, а также без ненужных классов CSS, добавленных в HTML наценки.

Надеюсь, это поможет, так как у меня возникла проблема с маленькой удачей с предоставленными ответами.

источник

2016-07-28 13:15:27 samtruss1986

Как удалить поле в верхней части моей страницы

ответ

Смежные вопросы