fapchat
@fapchat

Как выравнивать паддинг дива по центру без использования маргина?

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" href="0.css">
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:300&display=swap" rel="stylesheet">

  </head>
  <body>
    <section id="section0">
<p class="p"><span class="span">THE</span> <span class="span0">MOON</span></p>
<aside class="aside">
<p class="p0">ПОЛЕТЫ НА ЛУНУ С <span class="span1">40% СКИДКОЙ</span></p>
  <p class="p1">Узнайте первыми об уникальном предложении и получите возможность
заказать десятидневный тур по цене пятидневного</p>
  <br><a href="#" >ПРИНЯТЬ УЧАСТИЕ</a>
  </aside>
    </section>
  </body>
  <script src="0.js"></script>
</html>


*{
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
body{

font-family: 'Open Sans', sans-serif;
font-weight: 300;
color: white;
}
#section0{
  background: url(bezimeni-27_E1v9oDX.png) no-repeat center/cover;
overflow-y: hidden;
height: 100vh;
}#section0 .p{
  text-align: center;
  font-size: 34px;
  margin-top: 5%;
}#section0 .span{
  border: 3px solid #fff;
  padding:0 5px;}
  #section0 .span0{
    font-weight: 800;
  }#section0 .aside{
    margin-top: 8%;
    margin-left: 26%;
text-align: center;
color: black;
padding: 80px 140px ;
background: #fff;
width: 660px;
  }#section0 .p0{
font-size: 30px;
font-weight: 800;
margin-bottom: 5%;
  }
  #section0 .span1{
font-weight: 800;


  }  #section0 a{
padding: 13px 28px;
background: orange;
color: #fff;

text-decoration: none;

  }


Как центрировать такой див без маргина, можно это сделать автоматически?

#section0 .aside{
    margin-top: 8%;
    margin-left: 26%;
text-align: center;
color: black;
padding: 80px 140px ;
background: #fff;
width: 660px;
  }

Не предлагайте text-align, он не выравняет по центру паддинг
  • Вопрос задан
  • 161 просмотр
Решения вопроса 1
RaySS
@RaySS
а есть слово верстальщица?
попробуй эти варианты:
1) align-items: center;
justify-content: center;

2) left: 50%

3) transform: translate ( Xpx, Ypx);
под X и Y подставь на сколько пикселей надо сдвинуть по осям
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
18 апр. 2024, в 21:56
2000 руб./за проект
18 апр. 2024, в 21:00
150 руб./за проект