Hi,

Say I have assigned a CSS class to a paragraph tag <p>

and in that class, padding-left is set to 5%

but when the site renders, it only pads out paragraphs that extend beyond 1 line.

For example:

in stylesheet:

p.main {
  padding-right: 20%;
  padding-left: 5%;
  text-align: left;
  color: #666666;
  font-family: verdana;
  font-size: 7pt;
}

in htm doc:

<p class='main'>Hello This is one line</p><br><br>
<p class='main'>Hello this is more than one line, because it is a very logn sentence. blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah </p>

this (^) renders (in FireFox) to this:

------

Hello this is one line

Hello this is more than one line, because it is a very long
sentence. blah blah blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah blah blah blah blah
blah blah



-------

Is it supposed to only pad multi line paragraphs? How can i make it pad single lines?

I dont get this problem in IE

Do you have a link to the actual site I am kinda slow and need to see it laid-out =D

http://www.neofate.co.uk

You can see the two single lines that are not indented, despite using the same css class as the main paragraph.

Using padding in <P> tag only applied to the 1st line. What you need to do is to put your paragraph inside a DIV container with padding-left: 5px;.

Using padding in <P> tag only applied to the 1st line. What you need to do is to put your paragraph inside a DIV container with padding-left: 5px;.


www.ex-designz.net
Dexter

it works if you replace it with margin (instead of padding)

incidentally Welcome to NeoFate, British Halo 2 Clan. should be a styled H1, seeing as it's a heading!

Great, thanks guys! Im pretty new to CSS and proper web design, this is my first project using CSS in fact.