update(CSS): web/css/css_grid_layout/basic_concepts_of_grid_layout

files/uk/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.md

@@ -83,7 +83,7 @@ _Сітковий контейнер_ утворюється шляхом ого
 }
 ```
 
-{{ EmbedLiveSample('sitkovyi-konteiner', '200', '330') }}
+{{EmbedLiveSample('sitkovyi-konteiner', '200', '330')}}
 
 Відтепер всі безпосередні нащадки стали сітковими елементами. У веббраузері не буде помітна жодна різниця щодо того, як ці елементи виводилися до перетворення їх на сітку, адже сітка створила для елементів одноколонкову сітку. На цьому етапі може мати зміст скористатися [Сітковим дослідником (англ.)](https://firefox-source-docs.mozilla.org/devtools-user/page_inspector/how_to/examine_grid_layouts/index.html), доступним як частина Інструментів розробника Firefox. Якщо переглянути цей приклад за допомогою інспектора Firefox, то буде помітна невелика піктограма біля значення `grid`. Клацніть на неї – і сітка елемента з'явиться у вікні браузера.
 
@@ -144,7 +144,7 @@ _Сітковий контейнер_ утворюється шляхом ого
 }
 ```
 
-{{ EmbedLiveSample('bazovyi-pryklad', '610', '140') }}
+{{EmbedLiveSample('bazovyi-pryklad', '610', '140')}}
 
 ### Одиниця вимірювання fr
 
@@ -187,7 +187,7 @@ _Сітковий контейнер_ утворюється шляхом ого
 }
 ```
 
-{{ EmbedLiveSample('odynytsia-vymiriuvannia-fr', '220', '140') }}
+{{EmbedLiveSample('odynytsia-vymiriuvannia-fr', '220', '140')}}
 
 ### Нерівні розміри
 
@@ -230,7 +230,7 @@ _Сітковий контейнер_ утворюється шляхом ого
 }
 ```
 
-{{ EmbedLiveSample('nerivni-rozmiry', '220', '140') }}
+{{EmbedLiveSample('nerivni-rozmiry', '220', '140')}}
 
 ### Змішування гнучких та абсолютних розмірів
 
@@ -273,7 +273,7 @@ _Сітковий контейнер_ утворюється шляхом ого
 }
 ```
 
-{{ EmbedLiveSample('zmishuvannia-hnuchkykh-ta-absoliutnykh-rozmiriv', '220', '140') }}
+{{EmbedLiveSample('zmishuvannia-hnuchkykh-ta-absoliutnykh-rozmiriv', '220', '140')}}
 
 ### Перелічення доріжок з записом repeat()
 
@@ -361,7 +361,7 @@ _Сітковий контейнер_ утворюється шляхом ого
 }
 ```
 
-{{ EmbedLiveSample('neiavni-ta-yavni-sitky', '230', '450') }}
+{{EmbedLiveSample('neiavni-ta-yavni-sitky', '230', '450')}}
 
 ### Калібрування доріжок та minmax
 
@@ -411,7 +411,7 @@ _Сітковий контейнер_ утворюється шляхом ого
 </div>
 ```
 
-{{ EmbedLiveSample('kalibruvannia-dorizhok-ta-minmax', '240', '470') }}
+{{EmbedLiveSample('kalibruvannia-dorizhok-ta-minmax', '240', '470')}}
 
 ## Сіткові лінії
 
@@ -480,7 +480,7 @@ _Сітковий контейнер_ утворюється шляхом ого
 }
 ```
 
-{{ EmbedLiveSample('roztashuvannia-elementiv-na-liniiakh', '230', '450') }}
+{{EmbedLiveSample('roztashuvannia-elementiv-na-liniiakh', '230', '450')}}
 
 > **Примітка:** Не слід забувати про доступність в Інструментах розробника Firefox [Сіткового дослідника (англ.)](https://firefox-source-docs.mozilla.org/devtools-user/page_inspector/how_to/examine_grid_layouts/index.html), котрий дає змогу побачити, як елементи розташовуються біля ліній сітки.
 
@@ -569,7 +569,7 @@ _Жолоби_ чи _коридори_ між сітковими комірка
 }
 ```
 
-{{ EmbedLiveSample('zholoby') }}
+{{EmbedLiveSample('zholoby')}}
 
 Будь-який простір, зайнятий прогалинами, враховуватиметься до присвоєння простору доріжкам гнучкої довжини `fr`; для потреб калібрування прогалини діють як звичайні сіткові доріжки, хоч на цих доріжках і не можна нічого розмістити. При розташуванні на основі ліній прогалини діють як товсті суцільні лінії.
 
@@ -616,6 +616,7 @@ _Жолоби_ чи _коридори_ між сітковими комірка
 .wrapper {
   border: 2px solid #f76707;
   border-radius: 5px;
+  gap: 3px;
   background-color: #fff4e6;
   display: grid;
   grid-template-columns: repeat(3, 1fr);
@@ -641,7 +642,7 @@ _Жолоби_ чи _коридори_ між сітковими комірка
 }
 ```
 
-{{ EmbedLiveSample('vkladennia-bez-pidsitky', '600', '340') }}
+{{EmbedLiveSample('vkladennia-bez-pidsitky', '600', '340')}}
 
 В цьому випадку вкладена сітка не має взаємин з батьківською. Як це можна помітити у прикладі, вона не успадкувала {{cssxref("gap")}} предка, і лінії у вкладеній сітці не шикуються до ліній батьківської.
 
@@ -723,7 +724,7 @@ _Жолоби_ чи _коридори_ між сітковими комірка
 }
 ```
 
-{{ EmbedLiveSample('perekryttia-bez-z-index', '230', '460') }}
+{{EmbedLiveSample('perekryttia-bez-z-index', '230', '460')}}
 
 Елемент `box2` тепер перекриває `box1` і виводиться поверх, адже стоїть пізніше в коді.
 
@@ -784,7 +785,7 @@ _Жолоби_ чи _коридори_ між сітковими комірка
 }
 ```
 
-{{ EmbedLiveSample('kontrol-poriadku', '230', '460') }}
+{{EmbedLiveSample('kontrol-poriadku', '230', '460')}}
 
 ## Наступні кроки