Исходные колонки заказа на маленьких экранах

0

это сайт, когда я изменяю размер на маленькие экраны, он выглядит так:

Изображение 174551

Мне нужно, чтобы второй желтый блок был заменен нижним блоком, и я не могу сделать это с помощью кнопки pull и push

Какие-либо предложения?

  • 1
    Прочитайте здесь: stackoverflow.com/questions/21147499/…
  • 0
    из того, что я понимаю, есть только возможность изменить порядок столбцов по горизонтали в одной строке, но не по вертикали, даже если они находятся в одной строке.
Теги:
zurb-foundation

1 ответ

1

Если я правильно вас понимаю, вы хотите, чтобы конечный продукт выглядел следующим образом:

Изображение 174551

Текущий порядок строки, которую вы хотите изменить, - это DEAD MAINS CACHE (текст), BENJAMIN (Портрет), а затем ЗАЩИТИТЬ ШЕЙК (Coffee Bean?).

Переключатель DEAD MAINS CACHE (текст) и ЗАЩИЩАЙТЕ СВОЙ ШЕЯ (Кофейный боб?).

Удалите все ссылки на small и используйте push и pull для корректировки порядка для больших экранов.

Ваш текущий код:

<div class="row">
    <div class="small-12 small-push-12 large-4 columns">DEAD MAINS CACHE (Text)</div>
    <div class="large-4 columns">BENJAMIN (Portrait)</div>
    <div class="small-12 small-push-12 large-4 columns">PROTECT YOUR NECK (Coffee Bean?)</div>
</div>

Мое предложение:

<div class="row">
    <div class="large-4 large-push-8 columns">PROTECT YOUR NECK (Coffee Bean?)</div>
    <div class="large-4 columns">BENJAMIN (Portrait)</div>
    <div class="large-4 large-pull-8 columns">DEAD MAINS CACHE (Text)</div>
</div>

По сути, дизайн для мобильных устройств сначала и используйте push/pull для "исправления" больших размеров экрана.

Если я неправильно понял ваш вопрос, пожалуйста, дайте мне знать.

Надеюсь, это поможет.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню