Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.72/64: Рейтинг темы: голосов - 64, средняя оценка - 4.72
0 / 0 / 0
Регистрация: 17.03.2018
Сообщений: 3

Height: calc(100vh - 60px) работает некорректно

17.03.2018, 12:03. Показов 13493. Ответов 4
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Добрый день! Помогите плиз.

Функция height: calc(100vh - 60px);
При таком вычислении высоты почему то получает значение 40vh.
Вообще при любом вычислении игнорирует вторую единицу измерения, берет только её значение.
Во всех браузерах.
Все что нашел перепробовал, ничего не помогает.
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
17.03.2018, 12:03
Ответы с готовыми решениями:

Firefox height: calc(100% - 30px);
Во Всех браузера работает height: calc(100% - 30px); в Firefox - нет, возвращает значение как-будто стоит height: auto; , если ставить...

блоки с height внутри min-height не растягиваются или wrapper не растягивается
вот такой вот пример <html> <head> <style type="text/css"> * {margin:0; padding:0;} html {height:100%; } body...

не работает width и height
Всем привет. Как заставить работать height и width? http://jsfiddle.net/0ka1y383/

4
Эксперт HTML/CSS
 Аватар для Fedor92
2964 / 2621 / 1068
Регистрация: 15.12.2012
Сообщений: 10,091
Записей в блоге: 11
17.03.2018, 12:12
Sap_fear, по всей видимости в свойстве calc, недопустимо использование относительных единиц измерения... Или запрещено использование комбинированных единиц измерения... Скорее всего второй вариант... Поэтому при выполнении данного свойства броузер, считав высоту - 100vh, автоматом инетрпретирует - 60px, как 60vh...
0
0 / 0 / 0
Регистрация: 17.03.2018
Сообщений: 3
17.03.2018, 12:17  [ТС]
Fedor92, Как недопустимо? Эта функция была бы бесполезна в таком случае))
0
Эксперт HTML/CSS
 Аватар для Fedor92
2964 / 2621 / 1068
Регистрация: 15.12.2012
Сообщений: 10,091
Записей в блоге: 11
17.03.2018, 12:27
Цитата Сообщение от Sap_fear Посмотреть сообщение
Fedor92, Как недопустимо? Эта функция была бы бесполезна в таком случае))
А как Вам ещё отвечать? Это типа полтергейст и у Вас не работает, рабочий стиль... Ну, если Вам будет легче от этого, то Ваш стиль работает правильно, могу показать на скрине...
0
0 / 0 / 0
Регистрация: 17.03.2018
Сообщений: 3
17.03.2018, 12:55  [ТС]
Разобрался, может кому то пригодится. Проблема была в том, что Winless неправильно компилировал css.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
17.03.2018, 12:55
Помогаю со студенческими работами здесь

min-height не работает
у одного блока есть свойство min-height:700px; при наполнении содержимого больше чем 700 пикселей, блок в размере не увеличивается, и...

Height auto не работает
кто может посмотрите по ссылке , почему бэкграунд не растягивается до конца, контент есть а он занимает меньше (смотреть при экране mobile)

Свойство height не работает с li
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Title of the document</title> <style> html,body{ ...

max-height и min-height резиновый блок
есть див <div class="main"></div> подключены стили .main{ border:1px solid #0C0; max-width:3000px; min-width:1000px; ...

Не работает width и height в таблице
Подскажите в чем может быть проблема с таблицей не работает ширина и высота, побывал писать в самом теге так там синтаксис горит красным...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Новые блоги и статьи
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image
8Observer8 10.02.2026
Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .
Установка Qt-версии Lazarus IDE в Debian Trixie Xfce
volvo 10.02.2026
В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .
SDL3 для Web (WebAssembly): Работа со звуком через SDL3_mixer
8Observer8 08.02.2026
Содержание блога Пошагово создадим проект для загрузки звукового файла и воспроизведения звука с помощью библиотеки SDL3_mixer. Звук будет воспроизводиться по клику мышки по холсту на Desktop и по. . .
SDL3 для Web (WebAssembly): Основы отладки веб-приложений на SDL3 по USB и Wi-Fi, запущенных в браузере мобильных устройств
8Observer8 07.02.2026
Содержание блога Браузер Chrome имеет средства для отладки мобильных веб-приложений по USB. В этой пошаговой инструкции ограничимся работой с консолью. Вывод в консоль - это часть процесса. . .
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве
8Observer8 02.02.2026
Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .
Философия технологии
iceja 01.02.2026
На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .
SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf
8Observer8 01.02.2026
Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru