Please help me create a page border in HTML

Hi all,

I'm currently building a website which needs a relatively thick border around the whole site, and i'm stuck as to how I can achieve this in the simplest way.

I have attached an image to show you exactly what I need, if anyone can help me it would be great.



Thanks!

 

What program are you using to build the website? Regardless it seems to me that you need to create a smaller table (that is the white box needs to be smaller).

 

Put the following code in the HEAD of your page:

<style>
body {
border-right: 5px solid #000000;
}
</style>

Code (markup):

That will put a 5-pixel wide black border on the right side of the browser window. Then just change the hex color code and width to whatever you want.

 

sorry I thought you were talking about the pink box, Christian is right.

 

thanks very much for your help!

 

Hi, I tried it and it worked. Thanks. But I'm exactly trying to have a 'small image' as the 'border' instead of a SOLID colour, just like we can have an image in the 'page background' and just a few pixels are enough for that. Kindly suggest what should I do...

 

body { padding:30px; color:#FFDDDD;}
#pageWrapper { color:#FFFFFF; }

Though I usually set a max-width and % width on #pageWrapper instead of side-padding on body.

 

Something like this - http://royalark.net/China/china.htm
The image on the left border of the webpage.

 

For something like that on http://royalark.net/China/china.htm, You must in css set body background image...that's all

 

How?

 

Create a body with a padding inside it, 25px should be enough.

 

In Your css put something like:

body
{
background-image:url('yourimage.jpg');
background-color:#cccccc;
}

URL must point to Your image for background, and choose color to match image.
And if You want to repeat image put this:

background-repeat:repeat-y;

best regards

:

 

Thanks Everyone. I saw the source code of the websites I liked, googled what css is, and what I did finally was :- putting a background image (1 inch by 10 inches approx) by editing in paint (joining my desired "border" [1x1] on left hand side of the "plain image" [1x9]), and then it repeats itself in horizontal layers all over the page such that the desired result can be obtained.

BODY {
background: url(URLto.jpg);
border: 10px solid #ColorCode;
color: #000000; /*colour of text*/
margin-left: 20px;
margin-right: 20px;
font-style: normal;
font-family: Gisha, Verdana, Lucida Console, Helvetica;
font-size: 12pt;
}

I am practically zero at css and HTML but I apply changes to codes and try to learn. Now that I have successfully updated my site background, now I am trying to know how to increase or decrease horizontal space between consecutive bullets. The bullet spacing (auto) changed (doubled) when I inserted 30px right-margin.