Understanding CSS letter-spacing: is it valid to replace the default value of normal with 0?2019 Community...
What is this waxed root vegetable?
Sometimes a banana is just a banana
How to approximate rolls for potions of healing using only d6's?
Why does the author believe that the central mass that gas cloud HCN-0.009-0.044 orbits is smaller than our solar system?
I am on the US no-fly list. What can I do in order to be allowed on flights which go through US airspace?
Equivalent to "source" in OpenBSD?
I can't die. Who am I?
How to speed up a process
Replacement ford fiesta radiator has extra hose
How can atoms be electrically neutral when there is a difference in the positions of the charges?
CBP Reminds Travelers to Allow 72 Hours for ESTA. Why?
What am I? I am in theaters and computer programs
As a new poet, where can I find help from a professional to judge my work?
Auto Insert date into Notepad
If a druid in Wild Shape swallows a creature whole, then turns back to her normal form, what happens?
What's the difference between a cart and a wagon?
How would we write a misogynistic character without offending people?
If nine coins are tossed, what is the probability that the number of heads is even?
Can chords be played on the flute?
What is the wife of a henpecked husband called?
Casually inserting sexuality
Non-Italian European mafias in USA?
GeometricMean definition
Logistics of a hovering watercraft in a fantasy setting
Understanding CSS letter-spacing: is it valid to replace the default value of normal with 0?
2019 Community Moderator ElectionWhat are valid values for the id attribute in HTML?Which characters are valid in CSS class names/selectors?Is it valid to replace http:// with // in a <script src=“http://…”>?How can I set the default value for an HTML <select> element?CSS text justify with letter spacingIs there a way to make css letter-spacing: 0.5 px?Is background-color:none valid CSS?CSS letter-spacing SAFARICSS underline and letter-spacingInconsistent margin with em
According to this page, the CSS letter-spacing property has a default value of normal.
Notably, non-default values are added to the default value:
The most important point to note when using letter-spacing is that the
value specified does not change the default, it is added to the
default spacing the browser applies (based on the font metrics).
letter-spacing also supports negative values, which will tighten the
appearance of text, rather than loosening it.
According to this definition, 0 should be equivalent to the default value of normal since 0 + X = X.
1) Is it valid to use 0 as a replacement for the default value of normal? (This is for a slider implementation.)
2) Why isn't 0 the default value? Why introduce another value (i.e., normal)?
This test on CodePen also suggests a value of 0 is, indeed, equivalent to the default value of normal.
<p>This type has no additional letter-spacing applied.</p>
<p class="loose">This type is letter-spaced loosely at <code>2px</code>.</p>
<p class="tight">This type is letter-spaced tightly at <code>-1px</code></p>
<p class="zero">This type is letter-spaced at <code>0</code></p>
<p class="normal">This type is letter-spaced at <code>0</code></p>
.loose {
letter-spacing: 2px;
}
.tight {
letter-spacing: -1px;
}
.zero {
letter-spacing: 0;
}
.normal {
letter-spacing: normal;
}
html css letter-spacing
add a comment |
According to this page, the CSS letter-spacing property has a default value of normal.
Notably, non-default values are added to the default value:
The most important point to note when using letter-spacing is that the
value specified does not change the default, it is added to the
default spacing the browser applies (based on the font metrics).
letter-spacing also supports negative values, which will tighten the
appearance of text, rather than loosening it.
According to this definition, 0 should be equivalent to the default value of normal since 0 + X = X.
1) Is it valid to use 0 as a replacement for the default value of normal? (This is for a slider implementation.)
2) Why isn't 0 the default value? Why introduce another value (i.e., normal)?
This test on CodePen also suggests a value of 0 is, indeed, equivalent to the default value of normal.
<p>This type has no additional letter-spacing applied.</p>
<p class="loose">This type is letter-spaced loosely at <code>2px</code>.</p>
<p class="tight">This type is letter-spaced tightly at <code>-1px</code></p>
<p class="zero">This type is letter-spaced at <code>0</code></p>
<p class="normal">This type is letter-spaced at <code>0</code></p>
.loose {
letter-spacing: 2px;
}
.tight {
letter-spacing: -1px;
}
.zero {
letter-spacing: 0;
}
.normal {
letter-spacing: normal;
}
html css letter-spacing
1
Why the close votes?
– Crashalot
15 hours ago
1
w3.org/TR/css-text-3/#letter-spacing-property: normal No additional spacing is applied. Computes to zero. - It's just a keyword value
– Pete
15 hours ago
@Pete so you're saying normal and 0 are equivalent, right?
– Crashalot
15 hours ago
I assume so as that's the latest published version of css text module 3 and makes no mention of the user agent - drafts.csswg.org/css-values/#keywords
– Pete
15 hours ago
add a comment |
According to this page, the CSS letter-spacing property has a default value of normal.
Notably, non-default values are added to the default value:
The most important point to note when using letter-spacing is that the
value specified does not change the default, it is added to the
default spacing the browser applies (based on the font metrics).
letter-spacing also supports negative values, which will tighten the
appearance of text, rather than loosening it.
According to this definition, 0 should be equivalent to the default value of normal since 0 + X = X.
1) Is it valid to use 0 as a replacement for the default value of normal? (This is for a slider implementation.)
2) Why isn't 0 the default value? Why introduce another value (i.e., normal)?
This test on CodePen also suggests a value of 0 is, indeed, equivalent to the default value of normal.
<p>This type has no additional letter-spacing applied.</p>
<p class="loose">This type is letter-spaced loosely at <code>2px</code>.</p>
<p class="tight">This type is letter-spaced tightly at <code>-1px</code></p>
<p class="zero">This type is letter-spaced at <code>0</code></p>
<p class="normal">This type is letter-spaced at <code>0</code></p>
.loose {
letter-spacing: 2px;
}
.tight {
letter-spacing: -1px;
}
.zero {
letter-spacing: 0;
}
.normal {
letter-spacing: normal;
}
html css letter-spacing
According to this page, the CSS letter-spacing property has a default value of normal.
Notably, non-default values are added to the default value:
The most important point to note when using letter-spacing is that the
value specified does not change the default, it is added to the
default spacing the browser applies (based on the font metrics).
letter-spacing also supports negative values, which will tighten the
appearance of text, rather than loosening it.
According to this definition, 0 should be equivalent to the default value of normal since 0 + X = X.
1) Is it valid to use 0 as a replacement for the default value of normal? (This is for a slider implementation.)
2) Why isn't 0 the default value? Why introduce another value (i.e., normal)?
This test on CodePen also suggests a value of 0 is, indeed, equivalent to the default value of normal.
<p>This type has no additional letter-spacing applied.</p>
<p class="loose">This type is letter-spaced loosely at <code>2px</code>.</p>
<p class="tight">This type is letter-spaced tightly at <code>-1px</code></p>
<p class="zero">This type is letter-spaced at <code>0</code></p>
<p class="normal">This type is letter-spaced at <code>0</code></p>
.loose {
letter-spacing: 2px;
}
.tight {
letter-spacing: -1px;
}
.zero {
letter-spacing: 0;
}
.normal {
letter-spacing: normal;
}
html css letter-spacing
html css letter-spacing
asked 15 hours ago
CrashalotCrashalot
15.3k48189330
15.3k48189330
1
Why the close votes?
– Crashalot
15 hours ago
1
w3.org/TR/css-text-3/#letter-spacing-property: normal No additional spacing is applied. Computes to zero. - It's just a keyword value
– Pete
15 hours ago
@Pete so you're saying normal and 0 are equivalent, right?
– Crashalot
15 hours ago
I assume so as that's the latest published version of css text module 3 and makes no mention of the user agent - drafts.csswg.org/css-values/#keywords
– Pete
15 hours ago
add a comment |
1
Why the close votes?
– Crashalot
15 hours ago
1
w3.org/TR/css-text-3/#letter-spacing-property: normal No additional spacing is applied. Computes to zero. - It's just a keyword value
– Pete
15 hours ago
@Pete so you're saying normal and 0 are equivalent, right?
– Crashalot
15 hours ago
I assume so as that's the latest published version of css text module 3 and makes no mention of the user agent - drafts.csswg.org/css-values/#keywords
– Pete
15 hours ago
1
1
Why the close votes?
– Crashalot
15 hours ago
Why the close votes?
– Crashalot
15 hours ago
1
1
w3.org/TR/css-text-3/#letter-spacing-property: normal No additional spacing is applied. Computes to zero. - It's just a keyword value
– Pete
15 hours ago
w3.org/TR/css-text-3/#letter-spacing-property: normal No additional spacing is applied. Computes to zero. - It's just a keyword value
– Pete
15 hours ago
@Pete so you're saying normal and 0 are equivalent, right?
– Crashalot
15 hours ago
@Pete so you're saying normal and 0 are equivalent, right?
– Crashalot
15 hours ago
I assume so as that's the latest published version of css text module 3 and makes no mention of the user agent - drafts.csswg.org/css-values/#keywords
– Pete
15 hours ago
I assume so as that's the latest published version of css text module 3 and makes no mention of the user agent - drafts.csswg.org/css-values/#keywords
– Pete
15 hours ago
add a comment |
2 Answers
2
active
oldest
votes
No both aren't exactly equivalent. If you check the current specification
normal
The spacing is the normal spacing for the current font. This value allows the user agent to alter the space between characters in order to justify text.
Then
<length>
This value indicates inter-character space in addition to the default space between characters. Values may be negative, but there may be implementation-specific limits. User agents may not further increase or decrease the inter-character space in order to justify text.
In most of the cases, they will render the same but as you can read, the user agent doesn't handle both the same.
The definition in the Draft of the next level seems to have changed slightly and both are now the same.
For legacy reasons, a computed letter-spacing of zero yields a resolved value (getComputedStyle() return value) of normal..
You can also read here: https://github.com/w3c/csswg-drafts/issues/1484
CSS2 used to treat normal different than 0, so computing differently was a requirement. Now that the spec treats them the same ...
I don't know if all the browsers are already implementing this level but you can most likely consider them the same
so in CSS2, it only differs fortext-align: justify
– gsnedders
7 hours ago
@gsnedders yes it may differ with justify (not necessarely). Unfortunately I cannot proove it, I am trying to find if I can get a working example to show this difference.
– Temani Afif
7 hours ago
add a comment |
According to the Mozzila docs: https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing#Values
The normal letter spacing for the current font. Unlike a value of 0, this keyword allows the user agent to alter the space between characters in order to justify text.
Seems like 0
is more of a hard value to set it to the default. Normal can be modified by the user agent.
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54980706%2funderstanding-css-letter-spacing-is-it-valid-to-replace-the-default-value-of-no%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
No both aren't exactly equivalent. If you check the current specification
normal
The spacing is the normal spacing for the current font. This value allows the user agent to alter the space between characters in order to justify text.
Then
<length>
This value indicates inter-character space in addition to the default space between characters. Values may be negative, but there may be implementation-specific limits. User agents may not further increase or decrease the inter-character space in order to justify text.
In most of the cases, they will render the same but as you can read, the user agent doesn't handle both the same.
The definition in the Draft of the next level seems to have changed slightly and both are now the same.
For legacy reasons, a computed letter-spacing of zero yields a resolved value (getComputedStyle() return value) of normal..
You can also read here: https://github.com/w3c/csswg-drafts/issues/1484
CSS2 used to treat normal different than 0, so computing differently was a requirement. Now that the spec treats them the same ...
I don't know if all the browsers are already implementing this level but you can most likely consider them the same
so in CSS2, it only differs fortext-align: justify
– gsnedders
7 hours ago
@gsnedders yes it may differ with justify (not necessarely). Unfortunately I cannot proove it, I am trying to find if I can get a working example to show this difference.
– Temani Afif
7 hours ago
add a comment |
No both aren't exactly equivalent. If you check the current specification
normal
The spacing is the normal spacing for the current font. This value allows the user agent to alter the space between characters in order to justify text.
Then
<length>
This value indicates inter-character space in addition to the default space between characters. Values may be negative, but there may be implementation-specific limits. User agents may not further increase or decrease the inter-character space in order to justify text.
In most of the cases, they will render the same but as you can read, the user agent doesn't handle both the same.
The definition in the Draft of the next level seems to have changed slightly and both are now the same.
For legacy reasons, a computed letter-spacing of zero yields a resolved value (getComputedStyle() return value) of normal..
You can also read here: https://github.com/w3c/csswg-drafts/issues/1484
CSS2 used to treat normal different than 0, so computing differently was a requirement. Now that the spec treats them the same ...
I don't know if all the browsers are already implementing this level but you can most likely consider them the same
so in CSS2, it only differs fortext-align: justify
– gsnedders
7 hours ago
@gsnedders yes it may differ with justify (not necessarely). Unfortunately I cannot proove it, I am trying to find if I can get a working example to show this difference.
– Temani Afif
7 hours ago
add a comment |
No both aren't exactly equivalent. If you check the current specification
normal
The spacing is the normal spacing for the current font. This value allows the user agent to alter the space between characters in order to justify text.
Then
<length>
This value indicates inter-character space in addition to the default space between characters. Values may be negative, but there may be implementation-specific limits. User agents may not further increase or decrease the inter-character space in order to justify text.
In most of the cases, they will render the same but as you can read, the user agent doesn't handle both the same.
The definition in the Draft of the next level seems to have changed slightly and both are now the same.
For legacy reasons, a computed letter-spacing of zero yields a resolved value (getComputedStyle() return value) of normal..
You can also read here: https://github.com/w3c/csswg-drafts/issues/1484
CSS2 used to treat normal different than 0, so computing differently was a requirement. Now that the spec treats them the same ...
I don't know if all the browsers are already implementing this level but you can most likely consider them the same
No both aren't exactly equivalent. If you check the current specification
normal
The spacing is the normal spacing for the current font. This value allows the user agent to alter the space between characters in order to justify text.
Then
<length>
This value indicates inter-character space in addition to the default space between characters. Values may be negative, but there may be implementation-specific limits. User agents may not further increase or decrease the inter-character space in order to justify text.
In most of the cases, they will render the same but as you can read, the user agent doesn't handle both the same.
The definition in the Draft of the next level seems to have changed slightly and both are now the same.
For legacy reasons, a computed letter-spacing of zero yields a resolved value (getComputedStyle() return value) of normal..
You can also read here: https://github.com/w3c/csswg-drafts/issues/1484
CSS2 used to treat normal different than 0, so computing differently was a requirement. Now that the spec treats them the same ...
I don't know if all the browsers are already implementing this level but you can most likely consider them the same
edited 15 hours ago
answered 15 hours ago
Temani AfifTemani Afif
76.8k94490
76.8k94490
so in CSS2, it only differs fortext-align: justify
– gsnedders
7 hours ago
@gsnedders yes it may differ with justify (not necessarely). Unfortunately I cannot proove it, I am trying to find if I can get a working example to show this difference.
– Temani Afif
7 hours ago
add a comment |
so in CSS2, it only differs fortext-align: justify
– gsnedders
7 hours ago
@gsnedders yes it may differ with justify (not necessarely). Unfortunately I cannot proove it, I am trying to find if I can get a working example to show this difference.
– Temani Afif
7 hours ago
so in CSS2, it only differs for
text-align: justify
– gsnedders
7 hours ago
so in CSS2, it only differs for
text-align: justify
– gsnedders
7 hours ago
@gsnedders yes it may differ with justify (not necessarely). Unfortunately I cannot proove it, I am trying to find if I can get a working example to show this difference.
– Temani Afif
7 hours ago
@gsnedders yes it may differ with justify (not necessarely). Unfortunately I cannot proove it, I am trying to find if I can get a working example to show this difference.
– Temani Afif
7 hours ago
add a comment |
According to the Mozzila docs: https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing#Values
The normal letter spacing for the current font. Unlike a value of 0, this keyword allows the user agent to alter the space between characters in order to justify text.
Seems like 0
is more of a hard value to set it to the default. Normal can be modified by the user agent.
add a comment |
According to the Mozzila docs: https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing#Values
The normal letter spacing for the current font. Unlike a value of 0, this keyword allows the user agent to alter the space between characters in order to justify text.
Seems like 0
is more of a hard value to set it to the default. Normal can be modified by the user agent.
add a comment |
According to the Mozzila docs: https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing#Values
The normal letter spacing for the current font. Unlike a value of 0, this keyword allows the user agent to alter the space between characters in order to justify text.
Seems like 0
is more of a hard value to set it to the default. Normal can be modified by the user agent.
According to the Mozzila docs: https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing#Values
The normal letter spacing for the current font. Unlike a value of 0, this keyword allows the user agent to alter the space between characters in order to justify text.
Seems like 0
is more of a hard value to set it to the default. Normal can be modified by the user agent.
answered 15 hours ago
Andreas FursterAndreas Furster
9701524
9701524
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54980706%2funderstanding-css-letter-spacing-is-it-valid-to-replace-the-default-value-of-no%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
Why the close votes?
– Crashalot
15 hours ago
1
w3.org/TR/css-text-3/#letter-spacing-property: normal No additional spacing is applied. Computes to zero. - It's just a keyword value
– Pete
15 hours ago
@Pete so you're saying normal and 0 are equivalent, right?
– Crashalot
15 hours ago
I assume so as that's the latest published version of css text module 3 and makes no mention of the user agent - drafts.csswg.org/css-values/#keywords
– Pete
15 hours ago