Как бы я сделал заголовок полной ширины?И мне бы хотелось, чтобы класс контента был справа, а класс навыков - от 30% до 70%.Если вы в состоянии понять проблему, которую я не смог понять, пожалуйста, скажите мне, что вы сделали, чтобы заставить его работать.Спасибо.
Я не смог найти информацию о том, как сделать заголовок полной ширины и переместить содержимое в другие места ...
* {
box-sizing: border-box;
overflow: hidden;
padding: 10px;
margin: 0px;
}
body {
background-image: url("coder.jpeg");
background-size: cover;
}
.wrapper {
display:grid;
grid-template-columns: 70% 30%;
grid-template-rows: ;
grid-gap: 10px;
}
.header {
background-color: rgba(153, 153, 153, 0.99);
text-align: center;
border-radius: 10px;
font-size: 20px;
}
.skills {
background-color: rgba(153, 153, 153, 0.99);
border-radius: 10px;
}
.content {
background-color: rgba(153, 153, 153, 0.99);
border-radius: 10px;
}
<!DOCTYPE html>
<html>
<head>
<title>Cl32</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="./style.css">
</head>
<body>
<div class="wrapper">
<div class="header">
<header>
<h1>Cdad</h1>
</header>
</div>
<div class="skills">
<aside>
<h2>Skills</h2>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Nulla fuga asperiores iusto eveniet aliquid nobis aliquam ducimus, tempora consequatur neque earum molestiae unde porro, quis numquam error illum temporibus, incidunt autem. Temporibus maxime esse magnam inventore odit vero in quae sit quo laboriosam? Architecto saepe repudiandae ducimus possimus magni numquam?</p>
</aside>
</div>
<div class="content">
<h2>yuyuyggoggo</h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum mollitia sunt at aliquid unde vel sapiente quas sequi repudiandae, quam facere inventore suscipit sed nam quae possimus reprehenderit doloremque. Reprehenderit nisi architecto vel molestiae placeat necessitatibus deleniti laborum facere unde itaque magnam amet ut aspernatur distinctio atque ad perspiciatis nam beatae fugiat illum error veritatis, cupiditate odit? Deserunt earum magni id animi, temporibus sit obcaecati ipsum. Blanditiis, expedita? Fugit dicta ex dignissimos, esse totam voluptas illo maxime minus quae nisi velit nemo sequi nulla et omnis deserunt nam sed ducimus. Minima animi dolor vitae architecto suscipit ipsa eaque autem incidunt.</p>
</div>
</div>
<!--warpper class ends-->
</body>
</html>