This is really embarrassing but I can't figure out how to use the CSS
command 'width'. I want to be able to use it in the context of an
embedded command, as follows. Imagine I write: "The fox jumped over the lazy dog.". Ideally
that sentence would then appear formatted to a width of 25 (or
whatever) pixels. The manuals and the online sites all make me think
this should be possible. But nothing I do works. I'm beginning to
wonder if "width" doesn't work as an embedded command. But surely
that is wrong.Whoops. I see that what I want to do is called 'inline,' not 'embedded'.
Embedded means the command is at the top of the HTML document. I want
to put the command next to the text it is supposed to control. That
relationship is called 'inline'.hapgood-ga:
Can you clarify what exactly it is you are expecting to see when you
use the width property as the inline style for the span?
For example, are you expecting that the font size will automatically
change in order to fit the sentence into the width? If so, then that
is not what the width property will do, all it does it help the
browser decide when a new line is needed. If a word in the span is
longer than the space defined by the width property, that word will
not be truncated or scaled to fit; instead, the browser will go to a
new line after the word. So, the example you included above works
absolutely as designed.
Can you please tell us what you are expecting to see, so that we can
advise you accordingly?
Regards,
aht-ga
Google Answers Researcher> Can you clarify what exactly it is you are expecting to see when you
> use the width property as the inline style for the span?
> For example, are you expecting that the font size will automatically
> change in order to fit the sentence into the width?
Not at all. I'm expecting the sentence to be reformatted into
a single column like this:
I'm
expecting
the
sentence
to be
reformatted
into a
single
column.
> So, the example you included above works absolutely as designed.
It doesn't for me. To repeat: if I type the code "This is a sentence." Nothing happens. The
sentence
runs all across the entire page.
But if I replace the above code with "This is a
sentence.
" instead, changing nothing else, then I do get the
desired behavior, except with a bit of complexity having to do with
the 'p' properties.
Why is this? What is going on here? If the "p style" code works how
come the "span style" doesn't? Aren't they functional equivalents
from a CSS point of view? This is driving me batty.hapgood-ga:
Thanks for the clarification.
The reason why you are seeing the problem, is because the width
property is specifically not applicable to inline elements... and the
tag is specifically used for grouping inline elements, so
officially the width property is not applicable to spans.
W3C: Block-level and inline elements
http://www.w3.org/TR/html4/struct/global.html#edef-SPAN
W3C: Visual formatting model details
http://www.w3.org/TR/REC-CSS2/visudet.html#propdef-width
So, if you are using Mozilla Firefox, or Opera, as your browser, then
you will see the results that you are seeing. If, however, you are
using Internet Explorer (at least versions 6 or 7, as far as I'm
aware), then the width attribute does work with SPAN, because
Microsoft chose to go beyond the W3C specifications:
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/properties/width_2.asp
Interestingly, Microsoft refers to the CSS1 specification where the
'width' attribute is defined; yet, in that very specification, it
specifies that 'width' only applies to block-level and replaced
elements, not to inline elements such as SPAN.
So, to answer your final question, the difference between P and SPAN,
is that P is a block-level element, while SPAN is an inline element.
Since 'width' only applies to block-level and replaced elements, a
browser that strictly conforms to the W3C specifications (such as
Firefox or Opera) will ignore the 'width' attribute within a SPAN tag,
while a less-strict browser such as Internet Explorer, will let it
work.
Note that if your page design permits you to replace your SPAN tag
with a properly-used DIV, then you can use the width attribute.
Regards,
aht-ga
Google Answers Researcher#If you have any other info about this subject , Please add it free.# |
|
July 4th, 2009 | enart.ufhd.com | edit
