How to keep the page content out of the border



It doesn't look good when the text and images is all over the border of the background. But it is easy to prevent!

I use a table with 2 cells. The first cell holds an invisible graphic with the same width as the border of the background.

The invisible gif will force the cell with page content to the right, and keep the border clear. To do this, just copy and paste the first of the following tags just under the Body Background tag. And put the second tag just above the finishing tags for your HTML document.





< TABLE >
< TR >
< TD VALIGN=LEFT ALIGN=TOP >
< /TD >
< TD VALIGN=LEFT ALIGN=TOP WIDTH=100% >


Here comes your Page Content

< / TD >
< / TR >
< / TABLE >


Close the table at the bottom of your HTML document, right above the /Body and /HTML tag. End your html document like usual after the < / TABLE > tag:

< / BODY >
< / HTML >




  • Set the width of the "spacer.gif" according to the width of the border It doesn't have to be the exact width!.

  • Set the height of the "spacer.gif" to whatever you want (I use "10" so it is easy to find!)
    Set the Table width to 100 % so the table cover the whole page.




    Right click with your mouse in the "square" to save the invisible "spacer.gif"
    (The square is also "clickable" for webtv users.)






  • Put the "table closing" tag just above the "closing body and html tags".
  • Be SURE to add the closing tags! Or your page contents will not show up in the browser...

    Note: Be careful of the size of the images you use on your page.
    If they are too wide, they will stretch your table over the border background and maybe off the viewing area.

    Good Luck! *smile*
    Nefertare




  • Graphics and Design by Nefertare 1998-2002 ©




    1