Add border around store

[adam71o]

http://adamsville.net/shop is my store.

I am trying to add a 3px black border around the entire body to look like this (doctored image)


Any idea how to add that border (just around the outside)?

[paulM]

There are many ways to do that, I can tell how I would do it.
Unfortunately the creator of the template forgot to add some css classes and/or id's, so I would fist add an id to the outer table.

change (in the main_page.tpl.php of your template)

<!-- All TS references added by TemplateShopper.com November 2003
TS: 750 pixel centered table for all pages of store -->
<table align="center" width="750" border="0"  cellpadding="0" cellspacing="0">

to

<!-- All TS references added by TemplateShopper.com November 2003
TS: 750 pixel centered table for all pages of store -->
<table id="wrapper" align="center" width="750" border="0"  cellpadding="0" cellspacing="0">

and ad:

table#wrapper {
border: 3px ridge black;
}

to the stylesheet

For other border styles go visit w3schools.com and do a search for border

As a matter of fact I would at least move the width to the stylesheet too for example, this makes it a lot easyer and safer if you want to change it later, no need to edit the template itself anymore.

[adam71o]

How would I go about moving the bodywidth to the stylesheet?

[bdneuman]

Originally Posted by adam71o

How would I go about moving the bodywidth to the stylesheet?

I use this for centering my shop:

In mainpage.tpl.php, near the top:

<!-- header //-->
<div class="fixcenter">
<table border="0" width="100%" cellspacing="0" cellpadding="0">

Then, at the end of the file:

</div>
<!-- footer_eof //-->
</body>
</html>

In the stylesheet.css, define the "fixcenter" class:

.fixcenter {
  width: 760px;
  border: solid; border-width: 1px;
  background: #d6eaf0;
  color: #000000;
  margin: auto;
  text-align: left;
}

[paulM]

Originally Posted by adam71o

How would I go about moving the bodywidth to the stylesheet?

<!-- All TS references added by TemplateShopper.com November 2003  -->
<table id="wrapper" cellspacing="0">

and change the new stylesheet setting to (alike bdneumans stylesheet):

#wrapper {
  width: 750px;
  border: 3px ridge black; 
  margin: auto;
  text-align: left;
}

and to make the centering als work for several buggy IE versions you can also add:

body {
  text-align: center;
}

to the stylesheet