| Word Spacing Not Functioning
|
philipjterry
msg:4314716 | 3:33 pm on May 19, 2011 (gmt 0) |
I try to implement the following with no joy:
#horizontal {
width: 800px;
height: 24px;
text-indent:30px;
padding-top:6px;
color: #FFFFFF;
background: #FEAD1D url(images/horizontal.jpg) no-repeat;
word-spacing:44px;
}
Is this the correct command?
word-spacing:44px;?
Thanks a lot
|
lucy24
msg:4314731 | 3:57 pm on May 19, 2011 (gmt 0) |
It should work, but wouldn't it be better visually to express it in ems?
Caution: Browsers are not required to recognize word-spacing. The w3c folks [w3.org] say
| Conforming user agents may consider the value of the 'word-spacing' property to be 'normal'. |
|
That means you're allowed to ignore it even if you're not MSIE.
This minimalist version works on all five browsers on my Mac (Mozilla family, Apple Web Kit family, Opera):
<html>
<head>
<style type = "text/css">
.emstretch {word-spacing: 1em;}
.pixstretch {word-spacing: 24px;}
</style>
</head>
<body>
<p>Normal text.</p>
<p class = "emstretch">Stretched-out text in ems.</p>
<p class = "pixstretch">Stretched-out text in pixels.</p>
</body>
</html> |
|
When something doesn't work, the first step is always to strip it down to one command at a time and see where it breaks.
|
alt131
msg:4314754 | 4:18 pm on May 19, 2011 (gmt 0) |
Hi Lucy, good advice, but you've linked to css2. I think what you wanted was css2.1 [w3.org], which has qualfied that statement.
@philipjterry Yes, you have that correct. Can you be a little more specific about "no joy" :) For example, is there no change to the spacing between word at all? The posted code looks fine, but don't forget to Validate [jigsaw.w3.org] in case an error is affecting this, and check the element isn't inheriting a value from another rule.
|
|
|
