bikeshedding CSS3 собственост алтернатива?

Свойството празно пространство

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

1. normal (Първоначалната стойност).
2. nowrap

Но какво означават знаците за свиване на ред?

Според CSS 2.1:

Ако 'white-space' е зададено на 'normal' или 'nowrap', символите за подаване на ред се трансформират за целите на изобразяването в един от следните знаци: знак за интервал, знак за интервал с нулева ширина (U+200B) или никакъв знак ( т.е. не е изобразено), според специфични за UA алгоритми, базирани на скрипта за съдържание.

Според CSS 3:

Интервал с нулева ширина преди или след последователност от бели интервали, съдържаща нов ред, кара цялата последователност от празни интервали да се свие в интервал с нулева ширина.

Реалност:

Повечето браузъри трансформират знаците за подаване на ред в интервал. Така че това, което наистина искате, е да зададете свойството white-space-collapsing на discard, а не на collapse или на collapse и след това да добавите интервал с нулева ширина преди прекъсването на реда.

Какво да правите до поддръжка на браузъра

Премахнете празното пространство от вашия HTML документ:

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

To:

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

Or:

<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.

Доколкото мога да преценя, няма много поддръжка.