Too Much Space at Top of Page (Padding Issues)

Forum Moderators: open

Message Too Old, No Replies

Too Much Space at Top of Page (Padding Issues)

padding around edges of page--but not @ top and bottom

jandrews

3:19 am on Oct 5, 2006 (gmt 0)

When creating sites in Dreamweaver, I usually set the cell padding at 20 for the main table. However, this causes the heading at the top of the page to be pushed further down the browser.

How can I set cell padding **ONLY** for the right and left sides of the table? I don't want cell padding at the top and bottom of the table.

penders

2:11 pm on Oct 5, 2006 (gmt 0)

A tabled layout?! The page itself (body) has margins/padding - and these will be added to the padding in your table/cell.

Using CSS....

You can try:

<body style="margin-top:0;padding-top:0;"> 
...

Or if you have an external stylesheet:

body { 
margin-top:0; 
padding-top:0; 
}

I'm not too familiar with DreamWeaver to be honest, but padding always comes in all four flavours... top/right/bottom/left....

Set all edges to 20px padding:

padding:20px;

To explicilty set it for each side:

padding-top:5px; 
padding-right:10px; 
padding-bottom:15px; 
padding-left:20px;

Which is the same as (shorthand notation):

padding:5px 10px 15px 20px;

You can also set the same for top/bottom left/right:

padding:5px 20px;

...Which sets the top and bottom padding to 5px and the left and right padding to 20px

On a table cell (<td>) - no padding top/bottom, only left/right padding:

td { 
padding:0 20px; 
}

Note, you can have padding on a <table>, as well as a <td> (table cell).

Hope that helps.

jandrews

8:43 pm on Oct 5, 2006 (gmt 0)

Thanks penders. Your answered helped greatly. Yes, this is a table layout since it's just text on a page (sales copy). I'm using an external stylesheet to format the text (and subheadings), so using

didn't work for me since I had a class (in external stylesheet) named body.

I ended up using...

p {
padding-right:20px;
padding-left:20px;
}

in the stylesheet, and added

table style= "padding-top: 0; padding-bottom: 0" to the HTML.

That worked extremely well. Thanks!