Adding An XSitePro Border To Your Website
When you are building a website in XSitePro and want to add a border around the entire page, you
will need to add a bit of code to the “Global Scripts” section on the “Other” tab. Just copy the code below and
paste it into the Head section.
|
<style>
TABLE.XSP_OUTLINE {HEIGHT: 100%; WIDTH: 780px; border: 8px solid #B6B3B7; }
</style>
|
You will have to edit the width by changing the pixels to the size of your page. Also you can
change the width, the color, and the type of border.
If you want to add a border to each panel instead of the entire page, then try this code below.
|
XSitePro Version 1
|
XsitePro Version 2
|
|
<style>
td.XSP_HEADER_PANEL
{
border-top: solid 1px mediumblue;
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
}
td.XSP_CENTER_PANEL
{
border-top: solid 1px mediumblue;
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
}
td.XSP_LEFT_PANEL_SPC
{
border-top: solid 1px mediumblue;
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
}
td.XSP_LEFT_PANEL
{
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
}
td.XSP_RIGHT_PANEL_SPC
{
border-top: solid 1px mediumblue;
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
}
td.XSP_RIGHT_PANEL
{
border-left: solid 1px mediumblue;
border-right: ssolid 1px mediumblue;
border-bottom: solid 1px mediumblue;
}
td.XSP_FOOTER_PANEL
{
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-top: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
}
</style>
|
|
|
<style>
td.XSP_HEADER_PANEL
{
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
border-top: solid 1px mediumblue;
}
td.XSP_INFO_BAR
{
border-top: solid 1px mediumblue;
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
}
td.XSP_MAIN_PANEL_HEADER
{
border-top: solid 1px mediumblue;
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
}
td.XSP_CENTER_PANEL
{
border-top: solid 1px mediumblue;
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
}
td.XSP_LEFT_PANEL_SPC
{
border-top: solid 1px mediumblue;
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
}
td.XSP_LEFT_PANEL_2
{
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
}
td.XSP_RIGHT_PANEL_SPC
{
border-top: solid 1px mediumblue;
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
}
td.XSP_MAIN_PANEL_FOOTER
{
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
border-top: solid 1px mediumblue;
}
td.XSP_FOOTER_PANEL
{
border-left: solid 1px mediumblue;
border-right: solid 1px mediumblue;
border-bottom: solid 1px mediumblue;
border-top: solid 1px mediumblue;
}
</style>
|
|
The type of border can be any of the following:
 |
solid |
|
dashed |
|
dotted |
|
double (needs to be at least 3px wide) |
You can change the color to be whatever you like. You can use color names like Red, Blue
and Green or if you want to use an exact color you can use something like #00ff00.
The width can be any number of pixels between 1 and ?? , 1 or 2 pixels will give you a nice clean
edge.
| 
