Click to See Complete Forum and Search --> : Margin / Padding problem


mwmwnmw
12-18-2006, 04:39 PM
I have two divisions, "abar" and "meat". "abar" floats left, and "meat" is to run beside it on the right. So far so good. The issue is that I don't want the content of "meat" to start right at the border with "abar" I've run my css through the validator and it comes up with no errors, but for whatever reason I can't get the darned text off of that edge. The css is as follows:

#meat
{
margin-top: 0px;
height: auto;
font-family: tahoma;
font-size: 12px;
font-weight: 500;
color: #663333;
text-align: left;
margin-left: 10px;
padding-left: 10px;
}

The html is standard stuff. I close the "abar" div, open the "meat" div, and start running content. The only problem is that the conent begins right at the left edge. I tried using a generic
padding: 10px;
rather than
padding-left: 10px;
but all that did was move the content 10px down the page.

Centauri
12-18-2006, 08:13 PM
Because "abar" is floated, "meat" goes UNDER it - you need to give #meat a margin-left equal to the width of "abar", then the padding will work.

Cheers
Graeme

Davey_M
12-19-2006, 06:40 AM
if using set widths, by adding padding, either left or right... u need to deduct the same amount from the width, same goes if u are working on something with a set height...ie:

say below is 150px:

[---------------------]

if i was 2 add padding-left:10px; padding-right:10px; i would have to deduct 20px from the width so it would look something like:

[-[-----------------]-]

and the css:

{
width:130px;
padding-left:10px;
padding-right:10px;
}

if this is wrong or i have misread wot u were looking for then please correct me...