View Full Version : Two Columns; Should be Simple

07-14-2005, 05:10 PM
I posted this question in c.i.w.a.s and just got lectured on how bad my HTML and CSS are. So, let me say up front that I know they're bad. It's not my area of expertise. I'm a programmer, not a designer, and I just want to make a simple template or two to ship with a web application. I just want something that works.

Viewed in IE, this page is exactly what I'm trying to do:


If you don't have access to IE, here's a screen shot:


Header, two fixed-width columns, and a footer. However, in NS and Opera, the second column slides to the left, on top of the first column. I've read all the tutorials and examples I could find, but everything else ends up with the second column all the way over on the right side of the window. I just want it butted up against the first column. I know this should be simple, but I just can't get it.

I also tried absolute positioning, but then I couldn't figure out how to have my footer.

Please respond only if you have some insight into a solution for my layout problem. If you have specific suggestions about other things I might improve, that's welcome also. If you're only posting to lecture me, please assume in advance that I am duly impressed with the depth and breadth of your knowledge, and you needn't waste your time with such a lowly peasant as myself.

07-14-2005, 05:47 PM
through my experience this is just how the web browser displays it. there are alot of instances/websites that are displayed differently from browser to browser. there might not be any way of fixing this but.. i am not an expert either so if anyone else has suggestions.. yeah

Pepe, the bull
07-14-2005, 08:44 PM
You could add a left margin to the content div by adding this:

#Content {
width: 550px;
border: 1px solid #5C3908;
padding: 5px;
margin: 0 0 0 115px;

This should push the whole content div 115px to the right leaving your NavPanel by itself.

07-16-2005, 03:23 AM
Yes, that handled it perfectly. Thank you, Pepe.