7 replies [Last post]
marco
Offline
newbie
Last seen: 16 years 1 week ago
Timezone: GMT-5
Joined: 2003-11-10
Posts: 5
Points: 0

Hi,

First, thank you a great tool, it will no doubt help us all adopt CSS.

Now the problem, I tried the 3col fixed layout earlier today. I noticed that the generated page looks OK in IE but in Firebird the footer content (the word "Footer" is not centered vertically, but goes flush against the bottom.

Now I am trying to re-generate the page to chack again the problem, but the site has the "center Column" box checked and grayed out, so I can only create 2col layouts.

Is this a temporary generator problem or my browser? (Firebird 0.7)

Thanks

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 3 days 14 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5342
Points: 2963

Generator - Center Column disabled?

Hi Marco,
The center column checkbox is disabled and checked on purpose.
Every layout has a center column and you add a left and right if required.

I just preformed a quick test in firebird 0.6 and the template looks fine.
Once I get home tonight I'll have another closer look in Firebird 0.7

marco
Offline
newbie
Last seen: 16 years 1 week ago
Timezone: GMT-5
Joined: 2003-11-10
Posts: 5
Points: 0

Generator - Center Column disabled?

Oh, I got it, it makes sense and it saves me the headache of computing the width. Laughing out loud

Anyway, I re-generated the template (marco711) with the same parameters; you can clearly see the problem with Firebird 0.7.

I invoked it from your site and again the "Footer" text is flush with
the footer div bottom border.

marco
Offline
newbie
Last seen: 16 years 1 week ago
Timezone: GMT-5
Joined: 2003-11-10
Posts: 5
Points: 0

Generator - Center Column disabled?

In case the template is deleted, here are the parameters I used:

- 3 col centered, 700px, XTML strict
- header 40px, footer 20 px
- left 150px, right 150px

I am curious if you or somebody else can verify this on Firebird 0.7.

I was already drooling over having found here the "holy grail", as far as generating correct CSS layouts goes, without a ton of hacks (I am still a beginner).

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 3 days 14 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5342
Points: 2963

Generator - Center Column disabled?

Hi Marco,
I can see what you mean now, when the footer is 20px or less or the content of the footer is higher then the footer height, mozilla based browsers break out of the footer Sad
Looks like I have some tweaking to do.

Thanks for pointing it out.

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 3 days 14 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5342
Points: 2963

Generator - Center Column disabled?

Hi Marco,
If you set the height of the footer to a % value Mozilla based browsers will expand the footer to fit the content.
I can't think of any other solution at the moment so let me know if you think of something.

marco
Offline
newbie
Last seen: 16 years 1 week ago
Timezone: GMT-5
Joined: 2003-11-10
Posts: 5
Points: 0

Generator - Center Column disabled?

Well, I'm already used to the quirky world of browsers Laughing out loud
In any case, csscreator is already giving me and everybody else
a great start.

But I think there is a bit more tweaking to do to get the header and
footer content right. The problem is, if I fix it for one browser, it does
not work in the other(Drunk.

You can see what I am talking about in the marco748 layout where I set both the header and footer to 40px. Now their content is rendered inside the div's,
but slightly offset towards the top border. This seems to be consistent in both browsers.

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 3 days 14 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5342
Points: 2963

Generator - Center Column disabled?

Hi Marco,
The content in the header and footer and everywhere else is contained in a content div, you could try adjusting the padding on that.
To target the footers top padding try#footer .content{padding-top:10px;}

Hope that helps