nevalek

Как убрать отступ body

Recommended Posts

Начал верстать шаблон и сразу же непонятный момент.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
</head>
<body>
   <div class="container">
    <div class="header">
        <div class="product">
            <h1>Product Name</h1>
            <ul class="sps">
                <li>Put on this page information about your product</li>
                <li>A detailed description of your product</li>
                <li>Tell us about the advantages and merits</li>
                <li>Associate the page with the payment system</li>
            </ul>
        </div>
        <div class="banner"></div>
    </div>
    </div>
</body>
</html>

image.thumb.png.932dfa194c006137418e5c8be30d3917.png

Как убрать отступ, который сверху?

Share this post


Link to post
Share on other sites

h1 {margin: 0;}

ну и body {margin: 0; padding: 0;} хотя у нормалайза должно быть сброшено

А вообще, научитесь пользоваться DevTools

Share this post


Link to post
Share on other sites
1 час назад, Неугомонный сказал:

* {margin:0;padding:0}

Разве такой сброс стилей не является плохой практикой?

По теме, если правильно понял вопрос, то

h1 {margin-top: 0;}

 

Share this post


Link to post
Share on other sites
7 часов назад, Ryzex сказал:

Разве такой сброс стилей не является плохой практикой?

Так и есть

Share this post


Link to post
Share on other sites
13 часов назад, Неугомонный сказал:

И чем же плохо?

Тем и плохо, что например заказчик на часть страницы добавит параграф через админку, он то думает что у параграфа есть отступы, а вы их убрали для всех элементов.

Edited by relecteve

Share this post


Link to post
Share on other sites
04.08.2019 в 14:44, relecteve сказал:

Тем и плохо, что например заказчик на часть страницы добавит параграф через админку, он то думает что у параграфа есть отступы, а вы их убрали для всех элементов.

 

reset.css, например, тоже сбрасывает margin и padding у всех элементов, но делает это только для тех тегов, у которых они есть.
Заказчик, или контент менеджер, или кто там еще будет наполнять сайт, в большинстве случаев вообще не знают такие страшные слова как отступ у параграфа :) Да и в любом случае, для используемых тегов, все эти отступы будут переопределяться в стилях.

А плохая практика это потому, что " задает стили именно для всех элементов, для каких надо и каких не надо. А потом в отладчике появляются всякие сбивающие с толку паддинги у боди :)

Share this post


Link to post
Share on other sites
5 минут назад, AlexZaw сказал:

reset.css

Хватит использовать инструменты 2011 года 🙂 

мне так кажется)

Share this post


Link to post
Share on other sites
2 минуты назад, npofopr сказал:

Хватит использовать инструменты 2011 года

Я лишь привел пример :) Ну и, если честно, мне reset.css нравится, так как я могу быть 100% уверен что у всех элементов, во всех браузерах, стили будут одинаковыми и мне не придется учитывать особенности того или иного браузера.

Если есть лучшие варианты - буду рад ознакомиться.

Share this post


Link to post
Share on other sites

Да без разницы на самом деле, чем и как сбрасывать. Главное понимать, к чему это приведёт.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Member Statistics

    46,451
    Total Members
    3,128
    Most Online
    rhouland
    Newest Member
    rhouland
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.

  • Спрашивают сейчас

  • Пишут сейчас

    • Вернулся в свою созданную тему через 4,5 года. )) После создания темы около года верстал заказы на фрилансе. От обычной верстки до полноценных LP и небольших сайтов. Даже один раз из своей верстки шаблон Wordpress сделал.   Потом заинтересовался другими нишами и верстку забросил. Арбитражил, занимался СЕО, даже трейдил криптовалютой больше года. Но опять потянуло в вебразработку. Пытаюсь снова все вспомнить. Мешает только основная работа - мало времени остается на своё хобби.  В общем, кому сроки не жмут и кто не боится доверится джуниору, милости просим. Сверстаю, подправлю, помогу. В свободное от работы время. Бескорыстно. Просто хочется снова покодить и не просто так, а чтобы с пользой.  Почта : zdl79@mail.ru Skype : forest19791 Телеграмм : https://t.me/forestino
    • Могу попробовать. Опыт верстки 1 год. Но в связи с основной работой, не связанной с IT, мало на это времени. zdl79@mail.ru
    • Здравствуйте, кажется я делаю что-то не так, но вот что именно никак не пойму.
      Проблема в следующем: подключаю карусель и блок становится неактивен, хотя вроде бы все должно работать как нужно.
      Пробовал подключать карусель и через cdn и через скачанный архив - результат один и тот же.
      Открывал через google, firefox и opera-у - все так же никакого сдвига.
      Подключал по инструкции на официальном сайте.
      Пробовал использовать SlickSlider, но результат тот же.
  • Popular Contributors