Fixing the space / identation on a page

[dansbanners]

Hello everyone,

I'm trying to add more space on the right side of the main page (i.e. to the right of the 2 paragraphs), without having it affect the left side of the page (i.e. to the left of the 2 paragraphs):

http://www.dansbanners.com/Temp-Fitness/futurequest.html

Shown below, are the codes I use for the two paragraphs:

#main {
float: right;
width: 580px;
background: white;
padding: 5px 15px 0px;
line-height: 1.6em;
font-size: 1.0em;
}

#main p {
padding: 0px 0px 10px 0px;
margin: 0px;
}

When I toyed with the codes, seems that when I did add more space on the right side of the page, the left would get affected (i.e. it'll shift over to the left). I want the margin on the left to be the same, I just want to add more space to the right.

Anyone have any suggestions? Thanks in advance!

[Vonunov]

You can do:

#main p {
margin-right: #px; }

Might be what you're looking for. If you tried increasing the padding, that would indeed move the paragraph. This will compress it instead. Is this what you wanted, to add space to the right of the paragraphs within the border?

Original:

http://i30.tinypic.com/e99no2.png

Edit:

http://i25.tinypic.com/1z1y04k.png

Here I did margin-right: 75px;

[dansbanners]

Hi,

Ok, thanks!

There were times I was also wondering exactly what's the main difference between using the margin and using the padding. When should the margin be used or when should the padding be used, etc?

I'd appreciate it. Thanks again!

[Vonunov]

In a nutshell, padding is inside an element, and a margin is outside. If you put a border around p and switch around between margin-right and padding-right, you will see how this makes a difference. It's sometimes hard to tell without a border on the affected element why margins and paddings have different effects.

Original:

http://i31.tinypic.com/2vdo46p.png

Margin:

http://i32.tinypic.com/ap8s9k.png

Padding:

http://i27.tinypic.com/m4mfp.png

See http://www.cssnewbie.com/margins-and-padding-use/

At this point I'm unable to reproduce the problem you were having with the text being pushed over by padding. They should work the same way in this situation, anyway. Could have sworn I did yesterday, though. Oh, well.