Форум программистов, компьютерный форум, киберфорум
Наши страницы
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.54/41: Рейтинг темы: голосов - 41, средняя оценка - 4.54
Hagrael
БТР - мой друг
331 / 273 / 47
Регистрация: 07.01.2010
Сообщений: 1,932
1

float без переноса

19.09.2010, 15:33. Просмотров 7791. Ответов 9
Метки нет (Все метки)

Возможно ли задать float без переноса? Т. е. чтобы то, что после элемента с float'ом не переносилось ни при каких условиях.

Добавлено через 2 минуты
И ещё один вопрос - как отцентрировать float'ные элементы?
0
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
19.09.2010, 15:33
Ответы с готовыми решениями:

float: left без возможности переноса на новую строку
Вот код: <div style="float: left">FLOAT</div><div>NOFLOAT</div> Второй div...

Строка без переноса
Доброго времени суток уважаемые форумчане. Есть блок высотой в 20рх и в него...

Ошибка при создании трех колонок (float:left, float:right и margin:0 auto;)
3-й час бьюсь, но никак не могу понять, что не так делаю. почему оранжевый...

float элемент во float элементе
На странице есть два float элемента, один для меню, второй для контента. В...

Запрет переноса списка
Есть список ul, его элементы располагаются в строку (display: inline; ). Как...

9
Vovan-VE
13161 / 6546 / 1038
Регистрация: 10.01.2008
Сообщений: 15,070
19.09.2010, 15:43 2
Цитата Сообщение от Hagrael Посмотреть сообщение
Возможно ли задать float без переноса?
Нет. В этом и суть float'ов.
Цитата Сообщение от Hagrael Посмотреть сообщение
как отцентрировать 2 float'ные элементы?
Никак. Они либо направо, либо налево.

Сделать и то, и другое можно inline-block'ами.
HTML5
1
<div class="foo"><div class="item">1</div><div class="item">2</div><div class="item">3</div></div>
CSS
1
2
.foo {white-space:nowrap; text-align:center;}
.foo .item {display:inline-block; padding:8px; border:#ccc solid 1px;}
Если между элементами будут пробельные символы (символы новой строки - это тоже пробельные символы)
HTML5
1
2
3
4
5
<div class="foo">
  <div class="item">1</div>
  <div class="item">2</div>
  <div class="item">3</div>
</div>
то разные браузеры их будут отображать или не отображать.

Еще IE7 не понимает inline-block для блоковых элементов (div), но понимает для инлайновых (span, a). Лечится так:
CSS
1
.foo .item {display:inline-block; *display:inline;}
НО, теперь в IE7 для них нельзя задать width и height, ибо они inline.

Так что inline-block'ами надо пользоваться разумно.
1
Hagrael
БТР - мой друг
331 / 273 / 47
Регистрация: 07.01.2010
Сообщений: 1,932
19.09.2010, 15:51  [ТС] 3
Vovan-VE, понятно. Но если что можно заменить тег на span Спасибо.

Добавлено через 1 минуту
А по поводу переноса на новую строку - а что делать когда делаешь 2-хколонный макет на div-вёрстке? Задавать min-width у body?

Добавлено через 4 минуты
А центрировать при float'e в принципе глупо... Можно поместить в род. блок и задать ему margin: 0 auto. Будет ведь работать?
0
Vovan-VE
13161 / 6546 / 1038
Регистрация: 10.01.2008
Сообщений: 15,070
19.09.2010, 15:53 4
Цитата Сообщение от Hagrael Посмотреть сообщение
Задавать min-width у body?
Да
0
Hagrael
БТР - мой друг
331 / 273 / 47
Регистрация: 07.01.2010
Сообщений: 1,932
19.09.2010, 16:09  [ТС] 5
Vovan-VE, понял. Думаю, дальше вопросы появятся только на практике.

Добавлено через 13 минут
Спасибо всем, кто мне помогал! Вот то, что я сделал на div'ах. Смотреться будет хорошо как при 600*400, так и при 1280*1024.
0
Вложения
Тип файла: zip shapka.html.zip (654 байт, 80 просмотров)
Hurtsok
bigMatherHacker
108 / 78 / 12
Регистрация: 18.08.2010
Сообщений: 237
20.09.2010, 04:15 6
не вижу смысла делать для 600* 400 и даже для 800*600 . Если ты хочешь заточить под телефон то стоит делать отдельный вариант для pda.
0
Alorian
691 / 531 / 40
Регистрация: 22.06.2009
Сообщений: 1,293
20.09.2010, 11:10 7
Цитата Сообщение от Hagrael Посмотреть сообщение
Вот то, что я сделал на div'ах.
Для каждого пункта меню таблица обернутая в <a>... Оригинально.
Сделал то же самое, только в разы проще. Если покажешь несоответствия признаю что был не прав.
1
Вложения
Тип файла: zip myshapka.zip (30.8 Кб, 39 просмотров)
Hagrael
БТР - мой друг
331 / 273 / 47
Регистрация: 07.01.2010
Сообщений: 1,932
20.09.2010, 12:54  [ТС] 8
Alorian, твой вариант мне тоже нравится, но я не понял, как ты избежал авто-переноса списка? И ещё - я дал ту страницу без картинок =) Теперь посылаю её со всем вместе.
0
Вложения
Тип файла: rar Shapka.rar (8.4 Кб, 32 просмотров)
Alorian
691 / 531 / 40
Регистрация: 22.06.2009
Сообщений: 1,293
20.09.2010, 14:24 9
Цитата Сообщение от Hagrael Посмотреть сообщение
как ты избежал авто-переноса списка?
Что за авто перенос списка? Если ты про то что с уменьшением ширины список перенесется, так это потому что для трех пунктов меню 300 пикселей не хватает уже, если поставить min-width побольше либо сами пункты списка поуже, то ничего переноситься не будет.

Добавил твоих картинок, но смысла всех этих действий я по прежнему не понимаю. Это какая то сферическая верстка в вакууме. Нормальный сайт я так верстать практически наврерняка не буду. Один единственный раз я делал нечто похожее на промо сайте, там по сути одна картинка красивая, вот надо было чтобы она при любом разрешении влазила на экран. И то, там я от высоты отталкивался, а не от ширины, но реальный сайт практически всегда занимает несколько экранов в высоту и вот это все становится не нужным.

В твоем же случае на широкоформатнике картинки будут просто огромные если таким методом делать. Вобщем бессмысленная какая то верстка, но если тебе нужно — пользуйся.
1
Вложения
Тип файла: zip myshapka.zip (9.1 Кб, 46 просмотров)
Hagrael
БТР - мой друг
331 / 273 / 47
Регистрация: 07.01.2010
Сообщений: 1,932
20.09.2010, 14:29  [ТС] 10
Alorian, спасибо
0
20.09.2010, 14:29
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
20.09.2010, 14:29

Плавность переноса текста
Пишу, простенький сайт, подключил бутстрап для адаптива, на сайте есть кнопка...

Свойство переноса текста в DIV
Если в диве пишу много текста то он выезжает так, что появляется скролл. Знаю...

Запрет переноса строк в таблице
Здравствуйте. Как запретить перенос строк при изменение размеров, что бы...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
10
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru