12Vadim12
@12Vadim12

Как растянуть sidebar на высоту экрана без скрола?

6323016c825b7494612492.png
<div class="register__sidebar">
      <div class="register__sidebar-content">
        <div class="register__sidebar-header">
      <h2 class="register__sidebar-logo">dribble</h2>
      <h1 class="register__sidebar-main-text">Discover the world’s top Designers & Creatives.</h1>
    </div>
    <div class="register__artwork">
      <div class="register__sidebar-img">
        <img src="https://cdn.dribbble.com/assets/auth/sign-in-a63d9cf6c1f626ccbde669c582b10457b07523adb58c2a4b46833b7b4925d9a3.jpg" alt="1">
      </div>
      <h4 class="register__sidebar-author">Art by Irina Valeeva</h4>
    </div>
    </div>
    </div>

.register__sidebar {
  background:#f1cdd7;
  color:#865c6c;
  width:514px;
  position: relative;
}
.register__sidebar-content{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  flex: 1 1 auto;
}
.register__sidebar-header{
  padding: 64px 64px 30px;
}

.register__sidebar-logo {
  display: block;
  margin-bottom: 30px;
  opacity: 0.7;
}
.register__sidebar-main-text {
  font-size: 25px;
  line-height: 30px;
  display: block;
  max-width: 356px;
  font-weight: 900;
}
.register__artwork{
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  justify-content: flex-end;
}
.register__sidebar-img{
  flex-grow: 1;
  max-width:100%;
  height: auto;
}
.register__sidebar-img img{
  max-width: 514px;
  height:514px;
}
.register__sidebar-author {
  padding: 25px 64px 35px;
}
  • Вопрос задан
  • 58 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы