Подскажите, как правильно прописать позицию элементу DESIGN TEAM, чтобы он при изменении разрешения экрана не менял свое положение относительно элемента UNDERCOVER, и как не допустить появления полосы прокрутки.
Заранее благодарю за все ответы
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<div class="intro">
<h1 class = "logo"> UNDERCOVER </h1>
<h2 class = "logo_addition"> DESIGN TEAM </h2>
</div>
</div>
</body>
</html>
body {
background-color: #303030;
margin: 0;
}
h1,h2 {
margin: 0;
}
.container {
max-width: 1520px;
width: 100%;
margin: 0 auto;
}
.intro {
height: 1.61;
}
.logo {
margin-top: 74px;
font-weight: 400;
font-size: 60px;
text-align: center;
text-transform: uppercase;
color: #b69b67;
}
.logo:after {
content: "";
width: 400px;
height: 1px;
background-color: #b69b67;
margin: 0 auto;
display: block;
position: relative;
top: -73px;
}
.logo_addition {
position: relative;
left: 194px;
text-align: center;
text-transform: uppercase;
font-size: 30px;
font-weight: lighter;
color: #b4b4b4;
}
Простой
Средний