Stuck on CSS Layout

[Nicodemus]

Hi,

I'm stuck on this CSS layout I'm trying to make. It's basically the
sekeleton for a search screen in a big webapp I'm doing. The idea is
that the Titlebar-DIV and the Scope-DIV stay on top with a fixed height
and that the buttons-DIV stays at the bottom of the browserwindow and
also has fixed height.

The Tabbox-DIV has to fit inbetween the Scope-DIV and Buttons-DIV. This
implies that it's size (both height and with) resizes with the
browserwindow.

You can see the page at [url]http://www.haemhouts.be/a.html[/url]

Does anybody have any idea how to do this? I've even tried to give the
Tabbox-DIV a negative bottom-margin, but that only works in IE 6...and
not even completely because it still overlaps with the buttons-DIV.

Nicodemus.

[Al Sparber- PVII]

Nicodemus wrote:

> Hi,
>
> I'm stuck on this CSS layout I'm trying to make. It's basically the
> sekeleton for a search screen in a big webapp I'm doing. The idea is
> that the Titlebar-DIV and the Scope-DIV stay on top with a fixed
> height and that the buttons-DIV stays at the bottom of the
> browserwindow and also has fixed height.
>
> The Tabbox-DIV has to fit inbetween the Scope-DIV and Buttons-DIV.
> This implies that it's size (both height and with) resizes with the
> browserwindow.
>
> You can see the page at [url]http://www.haemhouts.be/a.html[/url]
>
> Does anybody have any idea how to do this? I've even tried to give the
> Tabbox-DIV a negative bottom-margin, but that only works in IE 6...and
> not even completely because it still overlaps with the buttons-DIV.

That's an exercise in futility. Any user in a modern browser can simply
resize text and your layout will be broken. You cannot assign a height
to an element unless the contents of that element are fixed-height as
well.

--
Al Sparber - PVII
[url]http://www.projectseven.com[/url]
DW Extensions - Menu Systems - Tutorials - Templates
---------------------------------------------------------
Webdev Newsgroup: [url]news://forums.projectseven.com/pviiwebdev/[/url]
CSS Newsgroup: [url]news://forums.projectseven.com/css/[/url]
RSS Feeds: [url]http://www.projectseven.com/xml/[/url]

[Nicodemus]

> That's an exercise in futility. Any user in a modern browser can simply

> resize text and your layout will be broken. You cannot assign a height
> to an element unless the contents of that element are fixed-height as
> well.
>

The idea is that the Tabbox-DIV gets an overflow:auto, meaning that if
they resize the text or the window is too small, that the tabbox-DIV wil
simple scroll the content.

[Al Sparber- PVII]

Nicodemus wrote:

>> That's an exercise in futility. Any user in a modern browser can
>> simply resize text and your layout will be broken. You cannot assign
>> a height to an element unless the contents of that element are
>> fixed-height as well.
>>

>
> The idea is that the Tabbox-DIV gets an overflow:auto, meaning that if
> they resize the text or the window is too small, that the tabbox-DIV
> wil simple scroll the content.

ah - I see. Then It's probably doable. I'll take another look at the
page and see if there's an easy answer (or any answer :-)

--
Al Sparber - PVII
[url]http://www.projectseven.com[/url]
DW Extensions - Menu Systems - Tutorials - Templates
---------------------------------------------------------
Webdev Newsgroup: [url]news://forums.projectseven.com/pviiwebdev/[/url]
CSS Newsgroup: [url]news://forums.projectseven.com/css/[/url]
RSS Feeds: [url]http://www.projectseven.com/xml/[/url]

[Nicodemus]

Thnx, I've been trying to solve this one for some time now, but can't
seem to find an answer. What I've done so far is give the tabbox-DIV a
percentage height of something like 65 or 75. That way it's usable in
the target resolutions of 1024 X 768 and 800 X 600. The only problem
with that is that users get a lot of empty space, especially the ones
with a larger screen...now the poor bastards are complaining :-) Can't
blame them, because one of the tabpages holds a list of results, and
they maximize their screen to see more results, but instead they see all
this empty space. Result, frustrated users. So, any insight from you
would be grately appreciated ;-)

Nico

Al Sparber- PVII wrote:

> Nicodemus wrote:
>

>>>That's an exercise in futility. Any user in a modern browser can
>>>simply resize text and your layout will be broken. You cannot assign
>>>a height to an element unless the contents of that element are
>>>fixed-height as well.
>>>

>>
>>The idea is that the Tabbox-DIV gets an overflow:auto, meaning that if
>>they resize the text or the window is too small, that the tabbox-DIV
>>wil simple scroll the content.

>
>
> ah - I see. Then It's probably doable. I'll take another look at the
> page and see if there's an easy answer (or any answer :-)
>

[Al Sparber- PVII]

Nicodemus wrote:

> Thnx, I've been trying to solve this one for some time now, but can't
> seem to find an answer. What I've done so far is give the tabbox-DIV a
> percentage height of something like 65 or 75. That way it's usable in
> the target resolutions of 1024 X 768 and 800 X 600. The only problem
> with that is that users get a lot of empty space, especially the ones
> with a larger screen...now the poor bastards are complaining :-) Can't
> blame them, because one of the tabpages holds a list of results, and
> they maximize their screen to see more results, but instead they see
> all this empty space. Result, frustrated users. So, any insight from
> you would be grately appreciated ;-)

Post the URL to your page on our CSS newsgroup again if you can - under
a new thread and I'll look at it this afternoon.

--
Al

[Al Sparber- PVII]

Not so, Rob. That only works for IE on the PC and any user who needs to
resize text in MSIE-PC will know how to do it - pixels or not.

rob :: digitalburn wrote:

> Not if you define the font-size is CSS to a px value.
>

>> That's an exercise in futility. Any user in a modern browser can
>> simply resize text and your layout will be broken.

--
Al Sparber - PVII
[url]http://www.projectseven.com[/url]
DW Extensions - Menu Systems - Tutorials - Templates
---------------------------------------------------------
Webdev Newsgroup: [url]news://forums.projectseven.com/pviiwebdev/[/url]
CSS Newsgroup: [url]news://forums.projectseven.com/css/[/url]
RSS Feeds: [url]http://www.projectseven.com/xml/[/url]

[rob :: digitalburn]

Not if you define the font-size is CSS to a px value.

> That's an exercise in futility. Any user in a modern browser can
> simply resize text and your layout will be broken.