Див выходит за рамки сайта

Блоки выходят за рамки сайта, что только не пробовал.

Родителю задавал параметры width100%, все параметры overflow: прописывал,
Не помогло.

css

   .foot  
 {  
 overflow: hidden;  
 text-align:center;  
 margin:15px;  
 display: inline-flex;  
 }  
   
   
 .foots  
 {  
   
 border: 3px solid #fff;  
 font-size: 13px;  
 padding: .5em 1em calc(.5em + 3px);  
 background-color: rgb(176,196,222);  
 color:rgb(245,245,245);  
   
 }

Пример ссылок

html

   <div class='foot'> 
 <a href='#'class='foots'>ссылка</а> 
  
 </div>

IaE8iDJxwas.jpg 154.8 Kb ⬇ 146

Увеличь body)
У тебя указано что ссылки будут в один ряд
________
посл. ред. 10.01.2022 в 14:37; всего 1 раз(а); by Hryhorii_Ivlev

Hryhorii_Ivlev , попробую, как с компа буду, гляну спс

652591566 (10.01.2022 в 14:24)
Блоки выходят за рамки сайта, что только не пробовал.

Родителю задавал параметры width100%, все параметры overflow: прописывал,
Не помогло.

css

   .foot  
 {  
 overflow: hidden;  
 text-align:center;  
 margin:15px;  
 display: inline-flex;  
 }  
   
   
 .foots  
 {  
   
 border: 3px solid #fff;  
 font-size: 13px;  
 padding: .5em 1em calc(.5em + 3px);  
 background-color: rgb(176,196,222);  
 color:rgb(245,245,245);  
   
 }

Пример ссылок

html

   <div class='foot'> 
 <a href='#'class='foots'>ссылка</а> 
  
 </div>

Для .foot укажи flex-wrap: wrap; и тогда ссылки будут не в линию.

Loll_lark , спасибки гляну

попробуй box-sizing: border-box;

Loll_lark , получилось, только блоки в разнобой получились

652591566 (10.01.2022 в 17:34)
Loll_lark , получилось, только блоки в разнобой получились

Почитай побольше про display: flex; Ибо в слепую, немного трудновато ориентироваться.
________
посл. ред. 10.01.2022 в 19:08; всего 1 раз(а); by Loll_lark