Помощник
|
Два div горизонтально, третий под ними |
valera-k
|
Сообщение
#1
|
||
|
|
||
|
|||
WoWeb |
24.6.2016, 15:38;
Ответить: WoWeb
Сообщение
#2
|
|
valera-k,
Попробуйте: Код .footer{
float:none; clear:both; } -------------------- |
|
|
falken |
24.6.2016, 16:33;
Ответить: falken
Сообщение
#3
|
|
valera-k, любитель говно-кода?) тогда первый способ вам не понравится - CSS нужно применять, а второй самое то! Стили в html коде, просто мечта, как вы и любите.
Способ 1. CSS: Код .clearfix:before, .clearfix:after { content:""; display:table; } .clearfix:after { clear:both; } .clearfix { zoom:1 } HTML: Код <div class="clearfix"> <div style="width:200px; float:left;"></div> </div> <div class="footer"></div> и футер никуда не убежит. в дальнейшем применяйте эту конструкцию везде, где нарушается поток. Способ 2. HTML: Код <div style="width:200px; float:left;"></div> <div style="clear:both;"></div> <div class="footer"></div> или Код <div style="width:200px; float:left; clear:both;"></div>
<div></div> <div class="footer"></div> -------------------- |
|
|
valera-k
|
Сообщение
#4
|
|
valera-k, любитель говно-кода?) тогда первый способ вам не понравится 1. Я так написал для наглядности и упрощения восприятия. 2. Вы сами то проверяли, то чего предлагаете? ваш вариант 1 размещает див В ДИВЕ, а не рядом, и обтекает его, чего быть не должно вариант 2 во всех браузерах все 3 дива один под другим. |
|
|
falken |
25.6.2016, 15:32;
Ответить: falken
Сообщение
#5
|
|
1. Я так написал для наглядности и упрощения восприятия. Для упрощения восприятия нужно показывать код как в исходниках (в идеале, чтобы вместо контента в блоках были поясняющие записи), а еще лучше наглядно демонстрировать на jsfiddle и детальней описывать задачу, ага? ваш вариант 1 размещает див В ДИВЕ, а не рядом, и обтекает его, чего быть не должно Так, лол, в чем проблема? Добавьте второй див и он будет обтекать первый, но при этом футер останется на своем месте: Код <div class="clearfix"> <div style="width:200px; float:left;"></div> <div></div> </div> <div class="footer"></div> Есть задача: Как footer оставить под двумя горизонтальными дивами? Задача, казалось бы, решена (футер не убегает): вариант 2 во всех браузерах все 3 дива один под другим. Если даете код, то поясняйте тогда что к чему и как на выходе должны располагаться блоки (все блоки)... А потом возмущаетесь что непонятный пустой контейнер куда-то делся. -------------------- |
|
|
Kumidzeke |
27.6.2016, 17:46;
Ответить: Kumidzeke
Сообщение
#6
|
|
Прочесть третью статью из выдачи гугла по запросу flexbox. И забыть про float.
Или добавлять как предложил товарищ falken clear: both; Лично я за первый вариант upd: Цитата в хроме и фоксе не работает, третий див убегает наверх Ничего подобного, в хроме ничего не убегает, следовательно проблемы на вашей стороне. http://codepen.io/anon/pen/dXvyPY Сообщение отредактировал Kumidzeke - 27.6.2016, 17:47 -------------------- Skype — Kumidzeke Vk — vk.com/za4me |
|
|
valera-k
|
Сообщение
#7
|
|
|
|
|
|
Похожие темы
Тема | Ответов | Автор | Просмотров | Последний ответ | |
---|---|---|---|---|---|
Жирные бурж ссылки под крипту Размещаем статьи на популярных международных сайтах |
0 | umexa | 372 | Вчера, 23:23 автор: umexa |
|
Жирные бурж ссылки под крипту Размещаем статьи на популярных международных сайтах |
0 | umexa | 314 | Вчера, 23:23 автор: umexa |
|
SEO-продвижение USA, Europe, Asia под ключ | Dating, Gambling, Essay и 10+ ниш | 3 | Needmylink1 | 1033 | Вчера, 21:26 автор: Needmylink1 |
|
SEO Линк Билдинг под Бурж | Вечные ссылки США, Европа и Мир с Гарантией | 21 | Needmylink1 | 7176 | Вчера, 21:16 автор: Needmylink1 |
|
Ссылки за которые не стыдно! Качественный линк билдинг сервис под Бурж от Westrank. Честный прайс. | 63 | DaoDog | 47494 | 19.4.2024, 12:05 автор: Omaxis |
Текстовая версия | Сейчас: 24.4.2024, 17:00 |