Высота страницы html

299

23 декабря 2016, 12:13

Прошу не закидывать меня тухлыми яйцами сразу, вопрос касательно верстки, стоит задача реализовать сайт на котором страница будет помещаться в высоту экрана без прокрутки, т.е выглядеть как приложение, если я задаю высоту экрана своего ноутбука в пикселях, то все хорошо, но как быть с мониторами с большим разрешением?

Answer 1

Вариант 1 (%):

html,body,div { 
  width: 100%; 
  height: 100%; 
  margin: 0; 
} 
 
div {background: #ccc;}

<div></div>

Вариант 2 (vh):

div { 
  height: 100vh; 
  background: #ccc;  
} 
 
html, body {margin: 0;}

<div></div>

Answer 2

* { 
  box-sizing: border-box; 
} 
 
html, body { 
  height: 100%; 
  margin: 0; 
} 
 
body { 
  padding: 1em; 
  background: antiquewhite; 
  outline: 1px dotted red; 
  outline-offset: -1em; 
}

Answer 3

Просто установите body свойство height: 100vh;. vh — это viewport height, то есть величина относительно окна браузера.

body {
  margin: 0;
  height: 100vh;
}

Answer 4

html,body{ 
height:100%;
}
.your-div-class{
height:100%;
}

http://codepen.io/DavidKern/pen/avgbRM

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Анимированное появление блока

Добрый деньХочу реализовать анимацию появления блока при клике

296

HTML

Взаимодействие Java с Javascript с помощью HtmlUnit

Стоит задача сделать парсер по расписанию преподавателейСайт реализован следующим способом, в окне input набирается имя преподавателя и выбирается...

334

HTML

Онклик после загрузки страницы

Подскажите почему не работает онклики после загрузки страницы:

373

HTML

Как работать с autocomplete через selenum java

Стоит задача: вставить в input имя и из autocomplete появится меню, в котором надо выбрать нужное имяВот сайт

272