CSS 411 ASAP (clever huh?)

In reference to the following html:

<span style="margin-left:40px"> Blah blah blah blah </span>

If the text within the span is long enough, then the text (rightfully) goes
to a second line. However, the second line is not indented (a la
margin-left). Why?!? How can I fix this? It's important that I use tables as
speringly as possible for my current project, so that is currently my last
resort. Ideas?

--
Alexander Ross
alexross (AT) bleen (DOT) net

Alexander Ross wrote:

In reference to the following html:

span style="margin-left:40px"> Blah blah blah blah </span

If the text within the span is long enough, then the text (rightfully) goes
to a second line. However, the second line is not indented (a la
margin-left). Why?!?

Because span is an inline-level element.

9.4.2 Inline formatting context
http://www.w3.org/TR/REC-CSS2/visure...ine-formatting

"The rectangular area that contains the boxes that form a line is called
a line box. [...] Since an inline box may not exceed the width of a line
box, long inline boxes are split into several boxes and these boxes
distributed across several line boxes. When an inline box is split,
margins, borders, and padding have no visual effect where the split
occurs. Formatting of margins, borders, and padding may not be fully
defined if the split occurs within a bidirectional embedding."

How can I fix this?

IMHO the only way is to use a block-level element like p or div, depends
on what you're trying to achieve.

Micha

Alexander,

Use div instead of span.

Joe


"Alexander Ross" <alexross (AT) bleen (DOT) net> wrote

In reference to the following html:

span style="margin-left:40px"> Blah blah blah blah </span

If the text within the span is long enough, then the text (rightfully)
goes
to a second line. However, the second line is not indented (a la
margin-left). Why?!? How can I fix this? It's important that I use tables
as
speringly as possible for my current project, so that is currently my last
resort. Ideas?

--
Alexander Ross
alexross (AT) bleen (DOT) net

Micha is spot on. Perhaps if you could expound on how this all fits into
your layout and precisely what you want to accomplish, we can help you
figure out a good solution.

--
Al Sparber - PVII
http://www.projectseven.com
Dreamweaver Extensions - DesignPacks - Tutorials - Books
---------------------------------------------------------------------
The PVII Newsgroup | news://forums.projectseven.com/pviiwebdev
The CSS Newsgroup | news://forums.projectseven.com/css
---------------------------------------------------------------------



"Alexander Ross" <alexross (AT) bleen (DOT) net> wrote

In reference to the following html:

span style="margin-left:40px"> Blah blah blah blah </span

If the text within the span is long enough, then the text (rightfully)
goes
to a second line. However, the second line is not indented (a la
margin-left). Why?!? How can I fix this? It's important that I use tables
as
speringly as possible for my current project, so that is currently my last
resort. Ideas?

On Mon, 4 Aug 2003 21:30:56 -0400, "Alexander Ross"
<alexross (AT) bleen (DOT) net> wrote:

span style="margin-left:40px"> Blah blah blah blah </span

If the text within the span is long enough, then the text (rightfully) goes
to a second line. However, the second line is not indented (a la
margin-left). Why?!? How can I fix this? It's important that I use tables as
speringly as possible for my current project, so that is currently my last
resort. Ideas?

<p style="margin-left:40px;text-indent:-40px">


Gary

This is superfantastifull!! Exactly what I was looking for.

--
Alexander Ross
alexross (AT) bleen (DOT) net


"Gary White" <reply (AT) newsgroup (DOT) please> wrote

On Mon, 4 Aug 2003 21:30:56 -0400, "Alexander Ross"
alexross (AT) bleen (DOT) net> wrote:

span style="margin-left:40px"> Blah blah blah blah </span

If the text within the span is long enough, then the text (rightfully)
goes
to a second line. However, the second line is not indented (a la
margin-left). Why?!? How can I fix this? It's important that I use tables
as
speringly as possible for my current project, so that is currently my
last
resort. Ideas?

p style="margin-left:40px;text-indent:-40px"


Gary