Отступы по краям у Grid layout

@Kerduk · Регистрация: 24.04.2018

Студворк — интернет-сервис помощи студентам

Приветствую Вас, господа прохожие и мастера)))
На днях решил сверстать навигационное меню на технологии "Grid layout"
Данная грид-сетка оставляет по бокам элемента отступы в несколько пикселей.
Я бы хотел, чтобы верхняя и нижняя линия меню(border) была на всю ширину экрана без отступов.
Каким методом это можно реализовать?

--------------------------------------------------------------------------------------------------
На скриншоте, Я отметил эти области красным маркером.
--------------------------------------------------------------------------------------------------

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!DOCTYPE html>
 
 
<html>
 
 
 
<head>
 
  <meta charset="utf-8" />
   
</head>
    
    
    
    
<body>
 
   
   <div class="container">
 
   <div class="item_menu">Главное меню</div>
 
   </div>
      
   
</body>
 
 
 
</html>

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
.container {
display: grid;
margin-top: 5%;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: auto auto;
grid-column-gap: 0px;
grid-row-gap: 0px;
 
}
 
 
 
.item_menu{
grid-column: 1 / 4; 
text-align:center;
font-size: 1.6vmax;
border-top: 1px solid black;
border-bottom: 1px solid black;
 
}

@6elka1703 · 07.08.2018, 22:30

Kerduk, у body обнулял margin и padding?

@Kerduk · 08.08.2018, 16:43 **[ТС]**

Нет, Я там не указывал margin и padding вообще)))

@6elka1703 · 08.08.2018, 17:25

Kerduk,

CSS
1
2
3
4
body{
margin:0;
padding:0;
}

@gogolik · 08.08.2018, 19:56

Не по теме:

6elka1703, будь терпимее, люди за помощью на форум идут, чтобы как раз таки узнать все эти тонкости.

@gogolik · 08.08.2018, 20:05

Kerduk, Изучите материал о normalize.css, чтобы знать о чем идёт речь.

@Kerduk · 08.08.2018, 20:09 **[ТС]**

Спасибо, Я уже понял в чем была моя ошибка спустя два часа после создания темы)))))

@Academik · 09.08.2018, 15:09

6elka1703, на сколько я знаю у тега body нет padding'ов, зачем его обнулять?

@6elka1703 · 09.08.2018, 15:13

Mr Coder, у body есть padding, как и у любого другого блока.Может он и равняется нулю, и обнулять его не стоит, но я по привычке это делаю.

@Academik · 09.08.2018, 15:14

6elka1703, делайте себе на здоровье, зачем другим советовать делать так же.

Сообщение от 6elka1703

у body есть padding

Нет у него padding'a.

@6elka1703 · 09.08.2018, 15:16

Mr Coder, ну раз вы так уверены возьмите в css поставьте body padding 20рх и увидите есть ли у него padding или нет

@Academik · 09.08.2018, 15:26

6elka1703, я говорю про значения по умолчанию, странно что вы этого не поняли. При верстки проекта достаточно обнулить внешний отступ у тега <body>

CSS
1
body{margin: 0;}

@6elka1703 · 09.08.2018, 15:28

Mr Coder,

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

. Я как раз понял.

Новые блоги и статьи Все статьи Все блоги /
Настройки VS Code Loafer 13.04.2026 { "cmake. configureOnOpen": false, "diffEditor. ignoreTrimWhitespace": true, "editor. guides. bracketPairs": "active", "extensions. ignoreRecommendations": true, . . .	Оптимизация кода на разграничение прав доступа к элементам формы Maks 13.04.2026 Алгоритм из решения ниже реализован на нетиповом документе, разработанного в конфигурации КА2. Задачи, как таковой, поставлено не было, проделанное ниже исключительно моя инициатива. Было так:. . .	Контроль заполнения и очистка дат в зависимости от значения перечислений Maks 12.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: реализовать контроль корректности заполнения дат назначения. . .	Архитектура слоя интернета для сервера-слоя. Hrethgir 11.04.2026 В продолжение https:/ / www. cyberforum. ru/ blogs/ 223907/ 10860. html Знаешь что я подумал? Раз мы все источники пишем в голове ветки, то ничего не мешает добавить в голову такой источник, который сам. . .
Подстановка значения реквизита справочника в табличную часть документа Maks 10.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: при выборе сотрудника (справочник Сотрудники) в ТЧ документа. . .	Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .	модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий anaschu 08.04.2026 https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI	Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .

@6elka1703 91 / 85 / 27 Регистрация: 29.10.2016 Сообщений: 928
	07.08.2018, 22:30
	Kerduk, у body обнулял margin и padding? 0

@Kerduk 23 / 7 / 0 Регистрация: 24.04.2018 Сообщений: 411
	08.08.2018, 16:43 [ТС]
	Нет, Я там не указывал margin и padding вообще))) 0

@gogolik
	08.08.2018, 19:56
	Не по теме: 6elka1703, будь терпимее, люди за помощью на форум идут, чтобы как раз таки узнать все эти тонкости. 0

@gogolik Супер-модератор 3970 / 2092 / 832 Регистрация: 13.03.2010 Сообщений: 6,905
	08.08.2018, 20:05
	Kerduk, Изучите материал о normalize.css, чтобы знать о чем идёт речь. 0

@Kerduk 23 / 7 / 0 Регистрация: 24.04.2018 Сообщений: 411
	08.08.2018, 20:09 [ТС]
	Спасибо, Я уже понял в чем была моя ошибка спустя два часа после создания темы))))) 0

@Academik 1030 / 682 / 297 Регистрация: 04.04.2013 Сообщений: 2,751
	09.08.2018, 15:09
	6elka1703, на сколько я знаю у тега body нет padding'ов, зачем его обнулять? 0

@6elka1703 91 / 85 / 27 Регистрация: 29.10.2016 Сообщений: 928
	09.08.2018, 15:13
	Mr Coder, у body есть padding, как и у любого другого блока.Может он и равняется нулю, и обнулять его не стоит, но я по привычке это делаю. 0

@6elka1703 91 / 85 / 27 Регистрация: 29.10.2016 Сообщений: 928
	09.08.2018, 15:16
	Mr Coder, ну раз вы так уверены возьмите в css поставьте body padding 20рх и увидите есть ли у него padding или нет 0