Как сверстать адаптивные блоки

Сообщений: 235 Регистрация: Янв 2014

21 Февраля 2018 19:15

:confused:Вроде простая задача, не могу придумать как расположить блоки что бы в адаптивном виде изменялось расположение (без позишен абсолют) смотрите схему на картинке.

Прикрепленные файлы

verstka.png (28.47 КБ) [ Скачать ]

Ansy

Сообщений: 108 Регистрация: Мар 2012

21 Февраля 2018 22:20

Навскидку для второго блока использовать float:right; для 1366 и float:left; для 768 и использовать clear:left. Главное держать все 3 дива в 1 секции.

SergF

Сообщений: 235 Регистрация: Янв 2014

21 Февраля 2018 22:31

Цитата
Ansy пишет: Навскидку для второго блока использовать float:right; для 1366 и float:left; для 768 и использовать clear:left. Главное держать все 3 дива в 1 секции.

Сделал, 3 блок становится на уровне высоты со 2, хотя место есть но почему то не поднимается на верх до 1

SergF Сообщений: 235 Регистрация: Янв 2014	#4 22 Февраля 2018 20:19 получилось, надо убрать у 3 блока флоат и добавить ему display: inline-block Изменено: SergF - 22 Февраля 2018 20:47

Новые темы	Объявления	Свободное общение
17:28 01.02. Апдейт 31.01 // Chrome готовит "чёрную метку" для ИИ? 17:18 Трафик пробил дно? Худший январь за 10 лет и внезапный рост продаж с Bing 17:05 Гугл официально убивает клики: кнопка "Show more" теперь открывает чат на весь экран вместо сайтов 17:00 Дзен окончательно всё? Или у кого-то еще «стреляет» белый контент? 16:53 "The web is a dynamic place". Мюллер ответил по шторму 30 января (лучше б молчал) 16:31 Плагин ответа 12:29 РСЯ и тормоза сайта: Яндекс начал штрафовать за плохой PageSpeed?	16:37 BIGPROXY.SHOP - Резидентные Ротационные Backconnect Proxy USA EUROPA MIX [Безлимитный трафик] 16:10 CryptoGraph — Анонимный обмен криптовалют без KYC и AML 15:45 Продам аккаунты Gmail USA IP \| Gmail MIX IP \| Outlook Old 11:21 Trustpilot Reviews \| Подниму рейтинг вашей компании 11:19 №1 Рассылка / Инвайтинг [TELEGRAM] \| Приватный метод 11:16 Продвижение YouTube видео в топ поиска \| Любой тип контента \| Гарантия результата 11:15 Продвижение сайта: [SEO-трафик][Вывод в ТОП][Крауд-маркетинг + SEO]	18:23 Осталось 3-5 месяцев до блокировки YouTube в России, — заявил Клименко 17:02 Gartner обещал смерть SEO к 2026 году. Открываем метрику и проверяем 11:50 [AI] Бот за $600к советовал есть сыр с крысами. Нью-Йорк его (наконец-то) снес 08:25 Отвратительное поведение 05:31 Точные прогнозы на футбол 11:00 Кто может дать инвайт на WebMasters? 17:58 Список обновленных тем пуст...

Новые темы

Объявления

Свободное общение

17:28 01.02. Апдейт 31.01 // Chrome готовит "чёрную метку" для ИИ?
17:18 Трафик пробил дно? Худший январь за 10 лет и внезапный рост продаж с Bing
17:05 Гугл официально убивает клики: кнопка "Show more" теперь открывает чат на весь экран вместо сайтов
17:00 Дзен окончательно всё? Или у кого-то еще «стреляет» белый контент?
16:53 "The web is a dynamic place". Мюллер ответил по шторму 30 января (лучше б молчал)
16:31 Плагин ответа
12:29 РСЯ и тормоза сайта: Яндекс начал штрафовать за плохой PageSpeed?

16:37 BIGPROXY.SHOP - Резидентные Ротационные Backconnect Proxy USA EUROPA MIX [Безлимитный трафик]
16:10 CryptoGraph — Анонимный обмен криптовалют без KYC и AML
15:45 Продам аккаунты Gmail USA IP | Gmail MIX IP | Outlook Old
11:21 Trustpilot Reviews | Подниму рейтинг вашей компании
11:19 №1 Рассылка / Инвайтинг [TELEGRAM] | Приватный метод
11:16 Продвижение YouTube видео в топ поиска | Любой тип контента | Гарантия результата
11:15 Продвижение сайта: [SEO-трафик][Вывод в ТОП][Крауд-маркетинг + SEO]

18:23 Осталось 3-5 месяцев до блокировки YouTube в России, — заявил Клименко
17:02 Gartner обещал смерть SEO к 2026 году. Открываем метрику и проверяем
11:50 [AI] Бот за $600к советовал есть сыр с крысами. Нью-Йорк его (наконец-то) снес
08:25 Отвратительное поведение
05:31 Точные прогнозы на футбол
11:00 Кто может дать инвайт на WebMasters?
17:58 Список обновленных тем пуст...

12.09.2017 17:51	Бесплатно сверстать дизайны UI (iOS)
13.06.2017 21:44	Нужно помочь сверстать или подобрать шаблон для wordpress
20.04.2017 21:23	Как правильно сверстать нестандартное меню?
19.06.2016 14:47	Сколько стоит сверстать шаблон дле? Ваши варианты.
02.04.2014 14:55	Готов сверстать 1 станичный PSD макет.