0 Пользователей и 1 Гость просматривают эту тему.
  • 4 Ответов
  • 716 Просмотров
*

liliya1919

  • Захожу иногда
  • 87
  • 0 / 0
Ребят помогите! Всю голову сломала!

На сайте модули выведены по 3 колонки в 3 строки с фиксацией в 34% 33% 33% div.

При таком варианте в мобильной версии все так же отображается....

а надо все смещение в 1 колонку но с сохранением оптимального размера для экрана мобилы

*

ProtectYourSite

  • Живу я здесь
  • 2356
  • 135 / 4
  • Безопасность вебсайтов
*

liliya1919

  • Захожу иногда
  • 87
  • 0 / 0
Re: Адаптация div под мобильную версию
« Ответ #2 : 25.04.2017, 14:44:34 »
@media используйте
он используется только в CSS , я же на HTML (в описании категории) прописываю дивы
*

dmitry_stas

  • Легенда
  • 13151
  • 1234 / 8
Re: Адаптация div под мобильную версию
« Ответ #3 : 25.04.2017, 14:59:24 »
ну так что вы предлагаете, какой выход? :) CSS придуман именно для того, чтобы можно было задавать стили. @media - чтобы можно было задавать стили для разных разрешений экрана. а вы хотите и стили задать, но и CSS при этом не использовать? :) прописывайте в HTML что хотите, просто пропишите это с классами разными. а эти классы уже опишите в любом подключаемом CSS, и все
Тут дарят бакс просто за регистрацию! Успей получить!
Все советы на форуме раздаю бесплатно, то есть даром. Индивидуально бесплатно консультирую только по вопросам стоимости индивидуальных консультаций
*

liliya1919

  • Захожу иногда
  • 87
  • 0 / 0
Re: Адаптация div под мобильную версию
« Ответ #4 : 25.04.2017, 15:14:52 »
ну так что вы предлагаете, какой выход? :) CSS придуман именно для того, чтобы можно было задавать стили. @media - чтобы можно было задавать стили для разных разрешений экрана. а вы хотите и стили задать, но и CSS при этом не использовать? :) прописывайте в HTML что хотите, просто пропишите это с классами разными. а эти классы уже опишите в любом подключаемом CSS, и все

Все получилось))) Спасибо)) (просто лень было стиль прописывать, думала есть проще вариант)
Кому надо :

Код
<div class="mod_me">
<div class="mod_me1">{module 1}</div>
<div class="mod_me2">{module 2}</div>
<div class="mod_me3">{module 3}</div>
</div>
Код
div.mod_me {
    margin: 0 auto;
    width: auto;
    max-width: 100%; /* контейнер не превышает 90% ширины экрана */
    }
div.mod_me1,div.mod_me2,div.mod_me3 {
    float: left;
    max-width: 33%;
    height: auto;
    padding: 3%; /* небольшие оступы для изображений */
    }
@media screen and (max-width: 480px) { /* разрешение смартфона */
    div.mod_me {
        width: 320px;
        min-width: 320px;
    }
    div.mod_me1,div.mod_me2,div.mod_me3 {
        max-width: 98%;
        height: auto;
        padding: 1%; /* небольшие оступы для изображений */
    }
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Обновить версию Joomla

Автор a.bardonava

Ответов: 2
Просмотров: 442
Последний ответ 11.07.2023, 11:40:04
от a.bardonava
Joomla не видит последнюю версию

Автор mak200

Ответов: 1
Просмотров: 426
Последний ответ 28.07.2022, 16:44:57
от mak200
Адаптация модуля для мобильной версии

Автор grizlik

Ответов: 4
Просмотров: 958
Последний ответ 14.06.2019, 15:09:07
от grizlik
После обновления на версию 3.9.0 не работают модули при добавлении в материал

Автор help-tend

Ответов: 10
Просмотров: 1823
Последний ответ 09.11.2018, 16:13:50
от help-tend
Можно ли использовать версию шаблона quickstart для сайта

Автор Space91

Ответов: 5
Просмотров: 581
Последний ответ 10.08.2018, 09:44:13
от dm-krv