Hi, all. I downloaded a simple template with the intention of improving it and adding some images so I could replace my current site (http://SFU3.com)'s beta design with something more structured and manageable. This is the template: http://www.getfreewebdesigns.com/preview/?template=330. (I don't know if asking for help on templates not downloaded from TODC is frowned upon, sorry if it is.)
Anyway, here it is- I wanted to have a header with three columns. Seemed simple. The left column would have the site logo, name, and slogan, the middle column would have social icons (twitter, facebook, AddThis, etc.), and the right column would have a spot for ads or a JavaScript scroller.
Now, I've been coding CSS for years, so I thought this would be pretty simple. But every time I tried to make the three columns, the right one would extend past the rest of the page, making it look horrible. So, in CSS, I tried setting DIV widths using in px, and that worked for the left and the middle, but not the right. Same extend problem. So (again in CSS) I tried setting DIV width using %. Still not working. So I took a break from the header and worked on the rest of the page for awhile. I previewed the page in FF3 and IE8 and somehow, the page looked fine! I took a look at the CSS and to my amazement, I saw that the width for the right DIV had been set to "200px%". Is it just me or is that not valid? I'm happy that it looks great, but I've never seen a DIV width defined by px AND % at the same time.
If needed, I can post the CSS. It's long, though.