Форум русской поддержки Joomla!® CMS
04.12.2016, 01:52:03 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

Войти
   
   Начало   Поиск Joomla 3.0 FAQ Joomla 2.5 FAQ Joomla 1.5 FAQ Правила форума Новости Joomla Реклама Войти Регистрация Помощь  
Страниц: [1]   Вниз
  Добавить закладку  |  Печать  
Автор

Для div сделать height: auto;

 (Прочитано 373 раз)
0 Пользователей и 1 Гость смотрят эту тему.
kik84
Живу я здесь
******

Репутация: +59/-4
Offline Offline

Сообщений: 1307



« : 11.05.2015, 20:46:19 »

Подскажите, как для div-а дать height: auto, чтобы фоновое изображение было адаптивным без лишних телодвижений с @media?
#block_01 {
  width: 90%;
  margin: 0 auto;
  height: auto;
  background: url('../images/team/01.jpg');
  color: #fff;
  position: relative;
}
Работает лишь вариант с height: ...px; но для респонса это совсем не то, что хотелось бы)
Воткнуть изображение через <img src... не могу, т.к. там подключен скрипт и придется уже его менять.
Записан
darkghost
Практически профи
*******

Репутация: +74/-0
Offline Offline

Сообщений: 1807



« Ответ #1 : 13.05.2015, 18:31:44 »

хорошо бы еще ссылочку на "больного", было бы проще оценить ситуацию. Почему не работает height: auto - может быть несколько причин, которые могут скрываться в родителе
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #2 : 13.05.2015, 19:28:33 »

Если нужно, чтобы тянулся сам блок, только:
а) вставлять изображение
б) растягивать скриптом
Если нужно оптимальное заполнение фоновой картинкой, то:
background-size:cover;
Записан
Bozhkov2
Давно я тут
****

Репутация: +8/-0
Offline Offline

Сообщений: 278



« Ответ #3 : 19.05.2015, 13:05:48 »

Родительскому div
 
Код:
disply:flex
тогда дочерний станет 100% по высоте родителя
Про flex-box http://pepelsbey.net/pres/flexbox-gotcha/#32
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #4 : 19.05.2015, 14:06:16 »

flex ещё недостаточно поддерживается, на мой взгляд.
Записан
Bozhkov2
Давно я тут
****

Репутация: +8/-0
Offline Offline

Сообщений: 278



« Ответ #5 : 19.05.2015, 14:19:29 »

Поддерживается он уже давно полностью. Просто не у всех последние версии браузеров. Хотя последние и не обязательно, главное не древние.
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #6 : 19.05.2015, 14:56:23 »

А я как сказал? Smiley Так то он со дня выхода поддерживается полностью. Просто не у всех что тогда, что сейчас последние версии браузеров. А на некоторых проектах использовать флекс в принципе недопустимо, т.к. многие предприятия сидят на фиксированных старых версиях. Одно дело когда css3-красоты не видно у клиента, другое flex-модель и развалившаяся вёрстка.
Дополню: Свойство поддерживается EI от 11-й (!) версии. Даже в Windows 8 по-умолчанию идёт десятый IE. Т.е. 11-й идёт в десятой винде. Можно загуглить долю 10-й винды на рынке десктопных ОС. Но суть думаю понятна.
« Последнее редактирование: 19.05.2015, 15:00:53 от Shustry » Записан
Bozhkov2
Давно я тут
****

Репутация: +8/-0
Offline Offline

Сообщений: 278



« Ответ #7 : 19.05.2015, 16:48:52 »

Можно еще загуглить долю IE Wink. Конечно это дело каждого, как делать. Я предложил вариант, вы предупредили. Дело сделано Azn. Но Chrome, Opera, Mozilla отображают отлично.
Записан
Страниц: [1]   Вверх
  Добавить закладку  |  Печать  
 
Перейти в:  

Powered by SMF 1.1.21 | SMF © 2006, Simple Machines

Joomlaforum.ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by Open Source Matters
the trademark holder in the United States and other countries.

LiveInternet