Ok so I thought i had a firm grasp on margins/padding... my issue is i have some elements... they are all alined how i want them but when i had text in them i wanted to add some padding (to push the txt off the walls) but when i added the padding it screwed up all my margins... the following is code

Note that i have commented out the padding because of this and the text within the divs is arbitrary

#search_field{
background-color: #FFFFFF;
border:3px ridge #FFFFFF;
margin: 10px 5px 10px 10px;
width: 784px;
height: 576px;
float: left;
/*padding: 3px;*/
}

#right_col_top{
background-color: #FFFFFF;
border:3px ridge #FFFFFF;
margin: 10px 10px 5px 5px;
height: 280px;
width: 198px;
float: right;
overflow: scroll;
/*padding: 3px;*/
}

#right_col_bottom{
background-color: #FFFFFF;
border:3px ridge #FFFFFF;
margin: 5px 10px 10px 5px;
width: 198px;
height: 280px;
float: right;
overflow: scroll;
/*padding: 3px;*/
}

Also for dimension purposes it is within a 1024 element leaving 42 px... 10 btw each element and the wrapper (amounting to 30px) and four 3px border occurrences...

I dont see why when i add padding (to push the text off the walls) it blows my element's alignment to heck-- am i missing something?

the following is code
That's too insufficient to understand your issue. Can we have a link to your page?

Really need to see the html the css applies to.

But as a guess, I suspect the parent element of the one you apply the padding to does not have a width specified and so the amount of padding is added to the overall width of the element and so could mess up your margins.

Try specifying a width to the parent element and then when you apply padding to the child element, it will push the child element's content away from the element's boundary.

code is too much to post- developing an asp.net project... also dont have it hosted, i use SQL...

for eg though these children are within a wrapper with a width of 1024 pixels. everything else is arbitrary...

they align as follows

| wrapper width 1024px |
| |
| 10px |search_field| 10px |right_col_top| 10px |
| 10px |search_field| 10px |right_col_top| 10px |
| 10px |search_field| 10px |right_col_bottom| 10px |
| 10px |search_field| 10px |right_col_bottom| 10px |
| |

and to add the css for the wrapper

#wrapper{
border: 8px ridge #FFFFFF;
font-family: 'century gothic' 'helvetica' 'arial';
background-color: #5D0404;
width: 1024px;
height: 768px;
margin: auto;
}

the other three elements have css as provided above.

Well then as a guess...the padding your adding to get some space on your text? Why arent you adding to the <p> tag in your css?

Perhaps:

#search_field p{padding: 25px;}

thanx! that worked like a charm!