Как задать ширину контейнеров относительно ширины экрана в процентах?

Добрый день!

Прошу помочь с написанием html и css для двух блоков, которые занимают 68% и 32% ширины экрана.

61e925c79a5ad793781368.jpeg
  • Вопрос задан
  • 728 просмотров
Решения вопроса 1
@MrColdCoffee
web
html
<div class="wrapper">

  <div class="left-block">
    1
  </div>
  
  <div class="right-block">
    2
  </div>

</div>

css
*{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	margin:0;
	padding:0;	
}
.wrapper{
  display: table;
  width: 100%;
  min-height:100vh;
  height:100%;
}
.left-block,.right-block{
  display: inline-block;
  min-height:100%;  
}
.left-block{width: 68%;background:green;}
.right-block{width: 32%;background:red;}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Shull
@Shull
хочу быть хорошим IT-шником
Если вы напишите для блока width:62%;, то он займёт 62%.
Однако, это 62% относительно его родителя. Посмотрите, насколько широк его родитель.
Например, у нас есть код:
<body><div></div></body>
Если наш body занимает в ширину весь экран, то div будет занимать 62% ширины экрана.
А вот если body занимает 50%экрана, то div будет занимать 31% ширины экрана.
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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