ArtsAutosBooksBusinessEducationEntertainmentFamilyFashionFoodGamesGenderHealthHolidaysHomeHubPagesPersonal FinancePetsPoliticsReligionSportsTechnologyTravel
  • »
  • Technology»
  • Internet & the Web

Using CSS The Right Way- Indenting a Paragraph

Updated on May 7, 2012

CSS is not easy for beginners, believe me, I know. As I have progressively become more familiar with Cascading Style Sheets, I have become aware of their incredible usefulness and versatility. It also seems there are hundreds of posts giving old,outdated, or completely wrong information regarding some common formatting methods. I wanted to take the time to dispel all that bunk and give you an easy and informative way to do a handful of functions you may see in the near future.

How to Indent (Tab) the First Line of a Paragraph


.ind {text-indent: 3 em;}


Put that code into your CSS file and then in your html <body></body>, place the following code:

<DIV class="ind"> This is your test paragraph. Only the first sentence will be indented. </DIV>

You don't have to use .ind. That is just the name I gave the division. You can use p{} or h{}. They would be implemented in the body as

<p> Your text here </p>

If you don't want to use a separate CSS sheet, you can put the following into your <head> </head> section:


p {text-indent: 3 em;}


You don't have to use em, you can use px or any other size convention.

Why I included it:

For some reason, many sites have not updated this simple code. Many sites will instruct you to do antiquated methods like: nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Or using a table or using the dd function (which is for definitions). Some suggest creating padding or margins for the first sentence, which is unnecessary. Some people are under the impression that this code indents the whole paragraph and not just the first line, which is incorrect. Padding would be more appropriate for that function.


    0 of 8192 characters used
    Post Comment

    No comments yet.