Page 1 of 1
How to indent text in HTML?
Posted: Wed Feb 16, 2011 12:40 pm
by Stefany93
Hello,
I am making a website now for my siblings, and it is almost ready, but one thing annoys me. I can't indent the text right!! I used tables and things like that but it never works. Could you guys give an advice what to do?
Thank you very much!
Stef
Re: How to indent text in HTML?
Posted: Wed Feb 16, 2011 12:57 pm
by Li Kao
What purpose do you to indent the text? The reason is very important, so you end up with a choice that reflects the meaning of your indent.
If it's code like text use the <pre> tag. It will result in a fixed space font and no linebreaks by default. So it's fit only for some purposes.
There are spaces like which won't be removed at the beginning of a line. But using them for indentation usually indicates a misunderstanding of what your real goal is. Can be used to indent code thought.
For most uses you don't want html to indent but css. Depending on what you need "margin-left" or "padding-left" could be right.
Re: How to indent text in HTML?
Posted: Wed Feb 16, 2011 1:40 pm
by fwiffo
As much as possible, you want the HTML to just describe the content of a page, and the CSS should describe what the content looks like.
For example your HTML might look like:
Code: Select all
<p>All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy.</p>
<p>All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy.</p>
Which, by default will look something like:
Code: Select all
All work and no play makes Jack a dull boy. All
work and no play makes Jack a dull boy. All work
and no play makes Jack a dull boy. All work and
no play makes Jack a dull boy. All work and no
play makes Jack a dull boy.
All work and no play makes Jack a dull boy. All
work and no play makes Jack a dull boy.
If you add some CSS to format the paragraphs:
Code: Select all
All work and no play makes Jack a dull boy.
All work and no play makes Jack a dull boy. All
work and no play makes Jack a dull boy. All work
and no play makes Jack a dull boy. All work and
no play makes Jack a dull boy.
All work and no play makes Jack a dull boy.
All work and no play makes Jack a dull boy.
If you have one particular section you want indented differently, you could use some other tag to set it off. One that is good for block-quotes is the blockquote tag.
Code: Select all
<p>All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy.</p>
<blockquote><p>The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.</p></blockquote>
<p>All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy.</p>
Which, by default, looks like:
Code: Select all
All work and no play makes Jack a dull boy. All
work and no play makes Jack a dull boy. All work
and no play makes Jack a dull boy. All work and
no play makes Jack a dull boy. All work and no
play makes Jack a dull boy.
The quick brown fox jumps over the lazy
dog. The quick brown fox jumps over the
lazy dog. The quick brown fox jumps over
the lazy dog. The quick brown fox jumps
over the lazy dog.
All work and no play makes Jack a dull boy. All
work and no play makes Jack a dull boy.
Re: How to indent text in HTML?
Posted: Thu Feb 17, 2011 9:42 am
by Stefany93
Thank you very much guys, you are great. Any ideas why the blockquote tag doesn't work in Notepad ++ ? Thank you!