Russian TYPO3 community

Russian TYPO3 community (http://forum.typo3.ru/index.php)
-   TypoScript практикум (http://forum.typo3.ru/forumdisplay.php?f=27)
-   -   Как во врапе добавить перенос строки? (http://forum.typo3.ru/showthread.php?t=9460)

NiKRON 09.05.2011 15:02

Как во врапе добавить перенос строки?
 
Код:

wrap = <li>|</li>
В конце должен быть перенос строки в HTML коде. Не <br />, а \n

-=UncleByte=- 09.05.2011 16:07

Чисто теоретически можно использовать наверное
Код:

noTrimWrap = |<li>|</li>символ_переноса_в_нужной_кодировке|
Хотя не понятно зачем именно так? Почему не <br />?

NiKRON 09.05.2011 18:04

noTrimWrap не работает в меню. Забыл добавить что нужно использовать именно linkWrap, чтобы в меню можно было ссылки помещать в <li>, а после них перенос.

Вообще не важно, перенос или пробел, главное, чтоб какой-нибудь пробельный символ. А то теги липнут, а я их верстаю в виде display: inline-block.

-=UncleByte=- 09.05.2011 18:09

Так и в чем проблема тогда указать для inline-block margin или padding?

NiKRON 09.05.2011 18:22

Проблема в том, что инлайн-блоки не будут переноситься если не будет пробелов :)

-=UncleByte=- 10.05.2011 04:21

А куда они должны переноситься?

NiKRON 10.05.2011 14:33

На новую строку. Это же инлайн-блоки :)
Вот пример:
http://postimage.org/image/89j6ntgk/
Если не сделать перенос, то Datorzinību pamati уйдёт вправо, за пределы блока, в котором находится список.

-=UncleByte=- 10.05.2011 14:48

Так зачем в таком случае делать inline-block, который понимается далеко не всеми браузерами? И тем более пытаться приделать к ним не свойственное им поведение?
Вполне достаточно display:block; float:left; в таком случае и не надо ничего выдумывать.

NiKRON 10.05.2011 15:10

inline-block понимается всеми браузерами.
Разве это не свойственно inline-block-у выстраиваться в строчку и переноситься в конце строки?
Блоки могут быть разной высоты поэтому float: left не подходит. Кстати display: block в данном случае писать не нужно, поскольку float автоматически его включает.

NiKRON 10.05.2011 15:13

Мне тупо нужно вставить пробел или перенос строки после </li>!
Не надо меня учить вёрстке, пожалуйста, я ей сам кого хочешь научу.

-=UncleByte=- 10.05.2011 15:35

Если они понимаются одинаково всеми браузерами, то почему Чикуенок так мучался (http://chikuyonok.ru/2011/04/inline-vertical-align/) и что-то изобретал? И остальные тоже - http://habrahabr.ru/blogs/css/117109/ .
IE так до версии 9 вообще не понимал что у inline-block может быть высота.
Не претендую на то, чтобы учить, просто к здравому смыслу призываю.

NiKRON 10.05.2011 15:51

А где он мучался-то? Очень правильно применил inline-block для решения своей задачи.
Для выравнивания по вертикали добавляется vertical-align: top и всё замечательно.

Что касается фразы «Вот только это не работает в Firefox 2, IE 6 и 7» (по ссылке на хабр)
Во-первых на FF2 и IE6 я не ориентируюсь, а для IE7 просто включается hasLayout.

Насчёт IE, inline-block и высоты — ерунда. Учите матчасть.

Продолжать будем? Я вёрстку уже сделал и другие варианты меня не устраивают, мне просто нужен ответ на мой вопрос.

-=UncleByte=- 10.05.2011 16:21

C термином "верстка под CMS" надо знакомиться вдумчивее :) Если что-то не получается простым путем без использования "хаков", то, на мой взгляд, надо заходить с другой стороны. В данном случае с изменения верстки, потому что пробельные символы, которые окружают inline-block ведут себя неоднозначно даже и в ff4, из-за чего, скорее всего, и возникает необходимость вставить пробел или любой другой пробельный символ.

Из легких вариантов могу посоветовать поставить sourceopt и включить в нем Format HTML -> Logic line breaks (all box-elements). Скорее всего сработает и все li будут на новой строке каждый.

NiKRON 10.05.2011 16:35

Не знал, что вставка во враппер пробельного символа является «непростым путём с использованием „хакков“» :D

Цитата:

…пробельные символы, которые окружают inline-block ведут себя неоднозначно даже и в ff4, из-за чего, скорее всего, и возникает необходимость вставить пробел или любой другой пробельный символ.
пробельные символы ведут себя неоднозначно из-за этого необходимо вставить пробельный символ? вы поняли что написали? :)

В любом случае, вёрстка и CMS не должны зависеть друг от друга. Этого я натерпелся когда перевёрстывал однажды PHPbb. Бррр…

Спасибо за sourceopt. Много было оффтопа и наконец-то хоть какой-то ответ по теме!

-=UncleByte=- 10.05.2011 17:58

Хаком я назвал именно использование чего-то не входящего в "стандартную поставку".
Про пробельные символы развернуто ниже, а "необходимость вставить" - имел в виду ваш случай.

Количество пробелов, на мой взгляд, да и в принципе, не должно влиять на расстояние между inline элементами (такое поведение нормально и именно так себя ведут span, b, i, strong, img и т.д.), но в случае указания inline-block для любого элемента начинаются чудеса - если после такого элемента есть пробел, то появляется отступ одного размера, если пробела нет - отступ другого размера, при этом избавится от него и как-то его контролировать практически нереально (я не беру опытов с отрицательным margin и т.п.), причем происходит это в любых браузерах. Из этого я делаю вывод что использовать inline-block не особенно удобно и зачастую проще сделать другой вариант верстки, нежели искать пути сделать inline-block адекватно работающим.
Кстати, соглашусь что верстка и cms не должны зависеть друг от друга, но для этого сама верстка должна быть "пуленепробиваемой" на всех уровнях, а это в некоторых случаях не так.

NiKRON 10.05.2011 19:35

Так, извиняюсь за панику. Лох я. Забыл убрать white-space: nowrap вот у меня и не переносилось. На самом деле всё работает и пробел после </li> не нужен. :)

Насчёт пробелов между inline-block лучше делать так:
Код:

ul{
  font-size: 0;
}
li{
  font-size: … /* ставите что нужно */
}

после этого с помощью margin указываете отступы.

-=UncleByte=- 10.05.2011 19:53

Учитывая что все font-size идут в em, то это не самый удачный вариант. Проще использовать гарантированно работающие float и position :)

NiKRON 10.05.2011 23:52

Опять em… Ну зачем em?!! :O Это что, всеобщая паранойя?!

-=UncleByte=- 11.05.2011 04:28

Почему паранойя? Скорее уж мания, хоть чем так страшно использовать em - непонятно. Для тянущихся дизайнов лучше все-таки подходят em и проценты, чем фиксированные значения. Разве не так?

Valery Romanchev 11.05.2011 13:04

Цитата:

Сообщение от NiKRON (Сообщение 31070)
Код:

wrap = <li>|</li>
В конце должен быть перенос строки в HTML коде. Не <br />, а \n

Например так работает
wrap(
<li>
|
</li>
)


Часовой пояс GMT +4, время: 18:31.

Работает на vBulletin® версия 3.8.1.
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Перевод: zCarot