<!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, он не выравняет по центру паддинг
Простой
