Able to fix my coding?

[wfoster]

Ignore the heading.

I am trying to get a straight border line going upwards. I would like my page to show like this.

header
content -borderline- links
footer.

http://www.wfoster.co.uk
You see the blog, on the right of that I was a straight border line going from the header to the footer. How would I get it there and what would the CSS be and the content code?

Thank you in advance,
Wesley.

 

[angelwatt]

First, a note. The style tag is only allowed inside the head tag. Currently you have some inside the body tag.

For the most part you'll add,

border-right: 1px solid #000;

to the .pos_right selector. It won't go all the way from the header to the footer because of the way other CSS is set. I don't have the time to go into how to resolve that, but perhaps you can work from there.

Though, at least on my display when you add that piece of CSS, you'll have to scroll right to see the border being added. Again, this is because of other CSS going on.

 

[wfoster]

First, a note. The style tag is only allowed inside the head tag. Currently you have some inside the body tag.

For the most part you'll add,

border-right: 1px solid #000;

to the .pos_right selector. It won't go all the way from the header to the footer because of the way other CSS is set. I don't have the time to go into how to resolve that, but perhaps you can work from there.

Though, at least on my display when you add that piece of CSS, you'll have to scroll right to see the border being added. Again, this is because of other CSS going on.

Thanks angelwatt.

I have 2 more questions.

If you check my page again, how do I get that border to fit snug between the header and footer?

Last question,
Why is my scrollbar so long with no content when you scroll right?

 

[angelwatt]

The problems can be resolved by understanding the Box Model. I suggest reading it over (there's other write-ups on it as well if you want to search them out). I want to give you a chance to learn how this works as it is a critical piece the creating good CSS. General points for your page is that you'll want to create padding in the content area above and below rather than using margins or the br tags. The br tag should never be used for spacing.

As you move along if you run into some specific problems or questions feel free to ask them.

 

[wfoster]

Hi,

Thanks, just revising it now. I have a problem, you see my this image.

I am trying to get a vertical border just like it so it splits my page. Do you know how I would be able to get the line reach the footer and the header but have the same amount of text in the content of the line?

.sidebar { 
	border-left: double; 
	height: 100%; 
	
	}

This is the CSS I am using to display the border right now. Any help?

Thanks.

 

[angelwatt]

As I was trying to explain before, you'll want to use padding. An example:

.sidebar { 
	border-left: double; 
	height: 100%; 
	[B]padding-top: 3em;[/B]
	}

You'll have to adjust the amount of padding to fit your layout.