6 replies [Last post]
Anonymous
Anonymous's picture
Guru
calgary,alberta
calgary,alberta

I am new to CSS.......aren't most who ask questions ? Well, I like it, I like what it does, I like how it looks...but it can drive a person CRAZY.

I want my site, hazlett.net to be fluid, that is, I want it to look similar when the window is downsized, or if a person surfs to it using a different browser setting.

Now..it looks fine using MY settings, but when I downsize the window the right box overlaps the center box.

How to cure that ????

dJomp
dJomp's picture
Offline
Enthusiast
Last seen: 3 years 24 weeks ago
Joined: 2003-03-23
Posts: 422
Points: 0

Fluid ??

Widths. I'll look into it soon, shouldn't be too much trouble.

Flicking through the HTML though, I noticed a number of <HTML> </HTML> tags, and styles in random places! It's probably worth regrouping your HTML a bit, so it looks like:

<html>
<head>
...
<style>
...all styles here...
</style>
...
</head>
<body>
...the page content here...
</body>
</html>

IE is quite resiliant, but I bet there are a few browsers that would stop rendering your page on the first closed HTML tag.

But yeah I'll get back to you on the widths.

You know you're a geek when you try to shoo a fly away from the monitor with your cursor.

hazlett
Offline
newbie
columbus, ohio, usa
Last seen: 16 years 2 weeks ago
columbus, ohio, usa
Timezone: GMT-4
Joined: 2003-07-07
Posts: 3
Points: 0

Extraneous HTML Tags

I did have a few HTML tags that were not needed....something to be aware of when using SSI, I suppose.

Waiting for your word on widths.....thanks.....

dJomp
dJomp's picture
Offline
Enthusiast
Last seen: 3 years 24 weeks ago
Joined: 2003-03-23
Posts: 422
Points: 0

Fluid ??

The table that contains the stories (the grey ones) is too large. It's set to 55% - but when the left/right divs take up more than 45%, it stays at 55% and wraps underneath.

You could change all this around by using a DOCTYPE:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
which should be the FIRST thing in your HTML file. Then you need to change the width of the tables to 95% or something to make them larger.

But in older browsers (eg IE <5.5) it won't cure it since they don't read the doctypes. It then depends on how you want it layed out - I'd suggest removing the width from each table, and giving a margin-left/right of a few px - the table should then resize nicely with the page.

Hope that helps!

You know you're a geek when you try to shoo a fly away from the monitor with your cursor.

hazlett
Offline
newbie
columbus, ohio, usa
Last seen: 16 years 2 weeks ago
columbus, ohio, usa
Timezone: GMT-4
Joined: 2003-07-07
Posts: 3
Points: 0

thanks

Thanks for the help...it is much better. Now, if you don't mind helping some more, how do I make the center content area wider ? I have tried tweaking everything I can think of.

????

dJomp
dJomp's picture
Offline
Enthusiast
Last seen: 3 years 24 weeks ago
Joined: 2003-03-23
Posts: 422
Points: 0

Fluid ??

Hmm... The only way you could do that is to reduce the width of the left and right sidebars (#leftcontent, #rightcontent) and then touching up the margin-left and margin-right on the #centercontent element.

Couple of other quick things - you don't need the HTML tags in your CSS file; and it might be worth checking out all the double-quotes in your HTML - some are opened and never closed, which might confuse some browsers!

You know you're a geek when you try to shoo a fly away from the monitor with your cursor.

hazlett
Offline
newbie
columbus, ohio, usa
Last seen: 16 years 2 weeks ago
columbus, ohio, usa
Timezone: GMT-4
Joined: 2003-07-07
Posts: 3
Points: 0

Thanks....

Thanks for all your help, dJomp.

I think I have it about where I want it now......until I learn of something else to play with.

Tongue