问题
Is there any alternative for bikeshedding
CSS3 property? It doesn't seem to be supported yet.
回答1:
The white-space property
In CSS3, The white-space
property is a shorthand for the white-space-collapsing
(I guess bikeshedding
means they don't know what to call it yet) and text-wrap
properties. The white-space
property is a CSS 2.1 property supported by most browsers and there are two values for it that collapse new lines:
normal
(The initial value).nowrap
But what does collapsing line feed characters mean?
According to CSS 2.1:
If 'white-space' is set to 'normal' or 'nowrap', linefeed characters are transformed for rendering purpose into one of the following characters: a space character, a zero width space character (U+200B), or no character (i.e., not rendered), according to UA-specific algorithms based on the content script.
According to CSS 3:
A zero width space before or after a white space sequence containing a newline causes the entire sequence of white space to collapse into a zero width space.
Reality:
Most browsers transform line feed characters into a space. So what you really want is to set the white-space-collapsing
property to discard
not collapse
or to collapse
and then add a zero width space character before the line break.
What to do till browser support
Remove white-space from your HTML document:
<span>A</span>
<span>B</span>
To:
<span>A</span><span>B</span>
Or:
<span>A</span><span>
B</span>
回答2:
There's always the most obvious fix, which is to simply remove the whitespace in the HTML:
http://jsfiddle.net/F3Mdd/1/ - it's really easy, and it just works. From this:
<div>a</div>
<div>a</div>
to this:
<div>a</div><div>a</div>
Here's a more detailed answer.
To be honest, I always just remove the whitespace...
回答3:
Another approach is simply to wait for this CSS3 feature and remove the whitespace by Javascript until then.
http://jsfiddle.net/rT4Dy/2/
$('[data-bikeshedding="discard"]').each (function () {
var node = $(this);
node.html (node.find ('> *').detach ());
});
回答4:
If I'm understanding you correctly, you mean the text-spacing property.
As far as I can tell, there isn't a lot of support.
来源:https://stackoverflow.com/questions/6350218/bikeshedding-css3-property-alternative