>>Though I note that it mainly picks up on <br> tags which allegedly are unclosed.<<
Youre BR tags *are* unclosed. You’re using XHTML 1.1 as your doctype. First off, that’s a little severe – 1.1 strict is as strict as you can possibly get, and when you use it, you should also serve it up as “aaplication/xhtml” (and trust me, you don’t want to do that. I’d start by loosening your hold on that doctype a tiny smidge, and taking it down to XHTML 1.0 Strict – or even XHTML 1.0 Transitional.
Either way, your BR tags *must* be in the <br /> format – self closing. That will get rid of those “br tags not closed” errors.
>>As for the validator, that’s something I’ll have a look at later.<<
It’s *really* something you should look at *first*. Why? because, when you have non-validating errors in your code, you’re throwing your browser in to “Quirks” mose, which displays things differently than it would if you were valid. If you have errors in your code, then “quirks” mode basically guesses what you want, and displays accrodingly – correct or not. Many times, if you simply validate your code, you’ll throw the browser back into “standards” mode, and your site will be displayed *exactly* how you specify – no guesses. So validation should be the *first* thing you do – not the last.
I’m not saying validation *will* make your site work like you expect it to – but many times, you’d be surprised. So definitely take him up on the suggestion and validate – it may just fix your problem.
>>How do I line up the two “columns” Categories and Archives horizontally like I’ve managed to do with the two above?<<
In what browser are they lined up? In both IE and Firefox, they’re a little messed up. Firefox is better, but IE is way off.
I’m looking at your code and stylesheet, and a lot of ot appears off. For the layout you’re looking for – well, did you use a theme already written out for you, and alter it with your own images? ‘Cause if so, you’ve used the wrong one for the look you’re after. Basically, your header div is set to clear anythign after it – which is your content. What you’re looking for is more of an HTML layout like:
<div id="container">
<div id="left">
left stuff here, inluding your imge site name and your content
</div>
<div id="right">
sidebar stuff here - starting with your graphic image at the top
<div id="sidebar_left">
left side of your sidebar
</div>
<div id="sidebar_right">
right side of your sidebar
</div>
<hr />
</div> <-- closing "right"
<hr />
</div> <-- closing "conatiner"
Your #continer should be 750px wide, margin:0 auto, to center the page in the browser window. The “left” div should be floated left. #right div should be floated right, and then the inner containers of the #right should also be floated.
The hr tags should be set to clear:both, visibility:hidden to clear your floats, and that’s all there is to it. The layout you have now appears to be something with a header stretched across the top, with two floated containers below it – NOT what you seem to be looking for.
Hope that helps a little.
