trying to set padding as a percent of the element to which the padding is being applied, rather than as a percent of the whole window

[lkrubner@geocities.com]

I've come up with a non-frame version of this site:

http://www.lauradenyes.com/

However, the owner doesn't like my version because the content in the
center sits too high in the center part, which wasn't a problem with
the frames.

The advantage of frames is that you can have a height based on a
percent of the frame, even when the frame takes up less than 100% of
the window. I'm trying to figure out how to do this CSS. I tried
setting padding:10% but the CSS read the 10% to be 10% of the whole
window, not the enclosing element.

The thing is, my design looked reasonable on monitors supporting
average sizes (1000 x 800) but she has a huge monitor and she likes to
look at the site with her window maximized.

If you look at the site you'll see the center frame is a gray area in
the middle. I recreated that as a DIV in the non-frame version. Is
there a way to get CSS to set padding based on a percent of just the
element that the padding is being applied to?

[Spartanicus]

Re: trying to set padding as a percent of the element to which the padding is being applied, rather than as a percent of the whole window

lkrubner@geocit ies.com wrote:
[color=blue]
>I've come up with a non-frame version of this site:
>
>http://www.lauradenyes.com/
>
>However, the owner doesn't like my version because the content in the
>center sits too high in the center part, which wasn't a problem with
>the frames.[/color]

Hard to tell exactly what you are talking about without an url.
[color=blue]
>If you look at the site you'll see the center frame is a gray area in
>the middle. I recreated that as a DIV in the non-frame version. Is
>there a way to get CSS to set padding based on a percent of just the
>element that the padding is being applied to?[/color]

See if this helps: http://www.student.oulu.fi/~laurirai/www/css/middle/

--
Spartanicus

[Baldy]

Re: trying to set padding as a percent of the element to which the padding is being applied, rather than as a percent of the whole window


"Spartanicu s" <invalid@invali d.invalid> wrote in message
news:1uggd1d1aq 7clp26i08ole7jg s6uf3c1fi@news. spartanicus.utv internet.ie...[color=blue]
> lkrubner@geocit ies.com wrote:
>[color=green]
> >I've come up with a non-frame version of this site:
> >
> >http://www.lauradenyes.com/
> >
> >However, the owner doesn't like my version because the content in the
> >center sits too high in the center part, which wasn't a problem with
> >the frames.[/color]
>
> Hard to tell exactly what you are talking about without an url.
>[color=green]
> >If you look at the site you'll see the center frame is a gray area in
> >the middle. I recreated that as a DIV in the non-frame version. Is
> >there a way to get CSS to set padding based on a percent of just the
> >element that the padding is being applied to?[/color]
>
> See if this helps: http://www.student.oulu.fi/~laurirai/www/css/middle/
>
> --
> Spartanicus[/color]


I've always just remade my own h1 and h2 and h3s, call them something else,
to get rid of the spacing problem. Then, all I do is add padding-top just
enough to center everything up. none of that line-height stuff, just a
little pad at the top to push it down to center.

www

[Spartanicus]

Re: trying to set padding as a percent of the element to which the padding is being applied, rather than as a percent of the whole window

"Baldy" <Baldy@poof.com > wrote:
[color=blue]
>I've always just remade my own h1 and h2 and h3s, call them something else,
>to get rid of the spacing problem.[/color]

What does this have to do with the thread?

I hope that by the above you are not referring to using divs instead of
headers. If so then you've completely missed the point about, and
purpose of markup and styling.

--
Spartanicus

[lkrubner@geocities.com]

Re: trying to set padding as a percent of the element to which the padding is being applied, rather than as a percent of the whole window

> I've always just remade my own h1 and h2 and h3s, call them something else,[color=blue]
> to get rid of the spacing problem. Then, all I do is add padding-top just
> enough to center everything up. none of that line-height stuff, just a
> little pad at the top to push it down to center.[/color]

I think you missed the point of my question. Putting a little padding
on top is leading to unsatisfactory results. If you look at
www.lauradenyes.com on a screen that is, say, 2400 by 1600 pixels,
you'll see the items in the center floating too high on the screen.
Giving the padding a percent doesn't fix the problem, as the right
adjustment on a huge monitor remains too much on a smaller monitor.
What would be nice if there was a way to say "Pad top by 20% of the
containing element". You can do that with frames, which was one
advantage of the old design.

[lkrubner@geocities.com]

Re: trying to set padding as a percent of the element to which the padding is being applied, rather than as a percent of the whole window

>> See if this helps: http://www.student.oulu.fi/~la urirai/www/css/middle/

That is crazy, jumbled up tutorial but, despite its weaknesses, I found
it utterly fascinating. I said "Wow" quite a few times. Where did you
find this stuff? Is this all CSS 3 or what? I'd never heard of
display:table-cell or quite a bit of the other stuff you mention.

[Spartanicus]

Re: trying to set padding as a percent of the element to which the padding is being applied, rather than as a percent of the whole window

lkrubner@geocit ies.com wrote:
[color=blue][color=green][color=darkred]
>>> See if this helps: http://www.student.oulu.fi/~la urirai/www/css/middle/[/color][/color]
>
>That is crazy, jumbled up tutorial but, despite its weaknesses, I found
>it utterly fascinating. I said "Wow" quite a few times. Where did you
>find this stuff? Is this all CSS 3 or what? I'd never heard of
>display:tabl e-cell or quite a bit of the other stuff you mention.[/color]

It's not my page and I haven't looked at it, but I trust the author to
supply correct information.

I presume that all the information given relates to CSS 2.1, but note
that IE has limited support for CSS 2.1. For example the display:table
family of property values is not supported by IE.

--
Spartanicus