Как отключить классы Joomla Span
Привет! Я хочу узнать, как я могу изменить отображение некоторых из моих модулей на мобильном телефоне.
В настоящее время у меня есть следующее в моем файле index.php:
<div id="leftcol" class="span8"><jdoc:include type="modules" name="welcome" style="xhtml" /></div>
<div id="rightcol" class="span4"><jdoc:include type="modules" name="laptop" style="xhtml" /></div>
который показывает 2 рядом, но мне бы хотелось, чтобы они были друг над другом при просмотре на экране мобильного устройства, т.е.
<div id="leftcol" class="span12"><jdoc:include type="modules" name="welcome" style="xhtml" /></div>
<div id="rightcol" class="span12"><jdoc:include type="modules" name="laptop" style="xhtml" /></div>
но я не уверен, как я иду о реализации этого. Буду очень признателен за некоторые советы.
Решение
Лучший подход, вероятно, заключается в добавить несколько пользовательских CSS с медиа-запросом, подобным этому или подобному:
@media only screen and (max-width: 767px) {
#leftcol.span8 {float: none; width: 100%;}
#rightcol.span4 {float: none; width: 100%;}
}
Пользовательские файлы CSS предпочтительнее, чем редактирование кода HTML или PHP, потому что ваши изменения с меньшей вероятностью будут перезаписаны будущими обновлениями.
Другие решения
Других решений пока нет …