bikeshedding CSS3 свойство альтернативы?

Есть ли альтернатива bikeshedding CSS3 свойство? Кажется, это пока не поддерживается.

4 ответа

Решение

Свойство пробела

В CSS3 white-space свойство является сокращением для white-space-collapsing (Похоже bikeshedding означает, что они еще не знают, как это назвать) и text-wrap свойства. white-space свойство является свойством CSS 2.1, поддерживаемым большинством браузеров, и для него есть два значения, которые сворачивают новые строки:

  1. normal (Начальное значение).
  2. nowrap

Но что означают сворачивающиеся символы перевода строки?

Согласно CSS 2.1:

Если для параметра "Пробел" задано значение "Обычный" или "Nowrap", символы перевода строки преобразуются для визуализации в один из следующих символов: пробел, пробел нулевой ширины (U+200B) или отсутствие символа (т.е. не отображается), в соответствии с алгоритмами, специфичными для UA, на основе сценария содержимого.

Согласно CSS 3:

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

реальность:

Большинство браузеров преобразуют символы перевода строки в пробел. Так что вы действительно хотите, чтобы установить white-space-collapsing собственность на discard не collapse или collapse и затем добавьте символ пробела нулевой ширины перед разрывом строки.

Что делать до поддержки браузера

Удалите пробелы из вашего HTML-документа:

<span>A</span>
<span>B</span>

Для того, чтобы:

<span>A</span><span>B</span>

Или же:

<span>A</span><span>
    B</span>

Всегда есть самое очевидное исправление: просто удалить пробел в HTML:

http://jsfiddle.net/F3Mdd/1/ - это действительно легко и просто работает. Из этого:

<div>a</div>
<div>a</div>

к этому:

<div>a</div><div>a</div>

Вот более подробный ответ.

Если честно, я всегда просто убираю пробелы...

Другой подход заключается в простом ожидании этой функции CSS3 и удалении пробелов с помощью Javascript до тех пор.

http://jsfiddle.net/rT4Dy/2/

$('[data-bikeshedding="discard"]').each (function () {
  var node = $(this);
  node.html (node.find ('> *').detach ());
});

Если я вас правильно понимаю, вы имеете в виду text-spacing имущество.

Насколько я могу судить, поддержки не так много.

Другие вопросы по тегам