I know this is an odd title because if I'm honest I have very little understanding of what I'm doing. Basically I've no idea how to explain how I want the page to look other than to draw it.
First, you have a body tag in your html 2 times, so remove the first one. Next, right after the <div id="page-wrap"> line, insert a div with a sidebar id, so: <div id="sidebar"></div>. Also, you have forgotten one closing <div> tag, so add that just before the <body> closing tag.
Next, the css. Your #page-wrap width is just a bit too small to fit the sidebar and the content area. You can change it from 800 to 900px or whatever you want really of course. The #sidebar div, float it to the left instead of to the right, give it a height (or it won't show without content) and maybe add a background-color: #A06B65; or whatever color/image you like of course. That's pretty much it, you might wanna think of indenting your code somewhat better for easier reading.
This is how I'd like the page to look
This is the css as is
Thanks so much in advance and apologies for my awful web design knowledge!
First, you have a body tag in your html 2 times, so remove the first one. Next, right after the
<div id="page-wrap">line, insert a div with a sidebar id, so:<div id="sidebar"></div>.Also, you have forgotten one closing
<div>tag, so add that just before the<body>closing tag.Next, the css. Your
#page-wrapwidth is just a bit too small to fit the sidebar and the content area. You can change it from 800 to 900px or whatever you want really of course. The#sidebardiv, float it to the left instead of to the right, give it a height (or it won't show without content) and maybe add abackground-color: #A06B65;or whatever color/image you like of course. That's pretty much it, you might wanna think of indenting your code somewhat better for easier reading.