paragraph "<p>" padding not applied

Question

The following three pieces of code behave exactly the same:

<p {padding: 0 15 0 15}>  A paragraph of text here...  </p>

<p> A paragraph of text here... </p>

<p style="padding: 0 15 0 15">  A paragraph of text here...  </p>

How do I get the paragraph indented on both sides? (I tried 15px instead of 15 (EDIT - but only on the first two), I also tried separating the numbers with commas, like an example I found on Google.)

The above code is in a div which is in the body, no other divs or tables, etc. are involved.

The div is defined:

<div style="background-color: white; color: black; overflow:auto">

Thanks for any help.

Solution 1

15? 15 what? Have you considered using units?

<p style="padding: 0 15px">foo</p>

Solution 2

Change:

<p {padding: 0 15 0 15}>  A paragraph of text here...  </p> 

to:

<p style="padding: 0px 15px 0px 15px">  A paragraph of text here...  </p> 

Solution 3

Maybe you have a previous line like this:

p { display: inline }

This CSS disable the use of padding.

Comments

[Rilien]

I thought it would work, but it didn't. I added the above code to my problem description.

[Rilien]

Thanks. I needed both the "style=" and the "px"

[jwhat]

I'd recommend using em instead of px because it's more cross-browser compliant. ie. <p style="padding: 0 1em;">bar</p>

[jwhat]

This example is incorrect, you still need a unit like 15px or 1em.

[cduhn]

@jwhat Using em instead of px isn't precisely a cross-browser compliance issue. It's more about prioritizing precise design (px) vs text-resizing (em). All browsers these days interpret the units correctly.