indenting text in body via CSS vs line break

[ChangKchu]

I have a problem - I redefined the body tag creating a new CSS style and one
attribute in the definition was the text indent 10px. The problem is when I
insert a line break - shift+enter - the text on the next row has a different
indent - different from the one defined in CSS. Why the text on the next row,
i.e. the row "bellow the line break" has a different indent? How to solve this?
Pls help.

[mzanime.com]

Show us a URL or your CSS code please.

[Joe Makowiec]

I get your answer and thank you for it, but I don't want to use
margins because I need to use the full width of the screen - there are
graphic elements that have to positioned right to the edges of the
screen (I need a lot of space:-). I am using line breaks not to have
so much space between the paragraphs...

Put the margins on the paragraphs, not the page. If you want to cut down
or eliminate the spacing between paragraphs, use:

p { margin-top : 0px; margin-bottom : 0px; }

[ChangKchu]

Thanx! I am still rather new to Dreamweaver so again- thanx

[mzanime.com]

A little bit of correction.... using <br> between paragraphs is not going to
give you less space, <br> is only a single line break.

If you want to reduce the margin placed below each <p> tag use this: p {
margin-bottom:0.3em; }

p { margin:0; } would work too. "margin" inherits to all four sides of a
block, and if the value is zero, then no metric is needed.

[Gary White]

Post by mzanime.com
If you want to reduce the margin placed below each <p> tag use this: p {
margin-bottom:0.3em; }

Just one small pointer here. IE and Gecko browsers interpret it slightly
differently. If you're going to set the bottom margin, you should also set
the top margin. I think, if I remember correctly, IE places the default
margin below the paragraph and Gecko browsers place it above. Also, if you
set it like this:

p{margin .3em 0}

It will collapse the .3em between paragraphs so, instead of getting .3 for
the bottom of one paragraph *and* .3 for the top of the following paragraph,
you get a net of .3 total between paragraphs. If the top and bottom margins
for the paragraph are different, the larger of the two is used between
paragraphs.

Gary

[mzanime.com]

Good points Gary. I was wondering if some browsers interpret the spacing *above* paragraph tags.... You forgot the hyper-colon in that example btw.

p { margin: .3em 0; }

[Gary White]

Post by mzanime.com
Good points Gary. I was wondering if some browsers interpret the spacing

*above* paragraph tags.... You forgot the hyper-colon in that example btw.

Post by mzanime.com
p { margin: .3em 0; }

Good catch! At least you understood what I was saying. :-)

Gary

[Michael Fesser]

.oO(mzanime.com)

Post by mzanime.com
You forgot the hyper-colon in that example btw.
p { margin: .3em 0; }

Also works without it, semicolons don't close a declaration, they
separate them. So if there's only one declaration you don't need it.

4.1.7 Rule sets, declaration blocks, and selectors
http://www.w3.org/TR/CSS2/syndata.html#q8

Micha

[Gary White]

Post by Michael Fesser
Also works without it, semicolons don't close a declaration, they
separate them. So if there's only one declaration you don't need it.

He wasn't talking about the semicolon. He was talking about the *colon*
in this:

p{margin .3em 0}

It should be:

p{margin: .3em 0}


Gary

[Michael Fesser]

.oO(Gary White)

Post by Gary White
He wasn't talking about the semicolon. He was talking about the *colon*
p{margin .3em 0}
p{margin: .3em 0}

Arrgh ... OK, _now_ I see that ...

Micha

[Gary White]

Post by Michael Fesser
Arrgh ... OK, _now_ I see that ...

Yep. Took me a minute too.


Gary

[James Shook]

Post by Michael Fesser
Also works without it, semicolons don't close a declaration, they
separate them. So if there's only one declaration you don't need it.

If you care, NN4 will sometimes fail to see the last rule without the
semi-colon.

[mzanime.com]

LOL! Oh you guys... I'm sure the guy who posted the original question doesn't give a [edit] about all of our technical idiosyncrasies.

[ChangKchu]

here's the code

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #000000;
text-indent: 10px;
}
h1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: bold;
color: #0066CC;
text-indent: 10pt;
}
br {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
text-indent: 10px;
font-weight: normal;
color: #000000;
}
-->
</style>
</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<p>lorem ipsum</p>
<p>lorem ipsum</p>
<p>lorem ipsum<br />
lorem ipsum<br />
lorem ipsum<br />
lorem ipsum
</p>
</body>
</html>

I get your answer and thank you for it, but I don't want to use margins
because I need to use the full width of the screen - there are graphic elements
that have to positioned right to the edges of the screen (I need a lot of
space:-). I am using line breaks not to have so much space between the
paragraphs...

So I don't know - looks like I'll have to indent the text from the layer's
edge with nesting another layer or table...

[Gary White]

On Mon, 21 Jun 2004 22:39:47 +0000 (UTC), "ChangKchu"

Post by ChangKchu
I have a problem - I redefined the body tag creating a new CSS style and one
attribute in the definition was the text indent 10px. The problem is when I
insert a line break - shift+enter - the text on the next row has a different
indent - different from the one defined in CSS. Why the text on the next row,
i.e. the row "bellow the line break" has a different indent? How to solve this?

That's because the text-indent only indents the first line of a
paragraph. Because you're using a line break instead of starting a new
paragraph, the next line is not indented at all. If you want all text
indented, try using margins instead of text-indent.


Gary