470,811 Members | 1,181 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 470,811 developers. It's quick & easy.

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 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?

Jul 21 '05 #1
6 3514
lk******@geocities.com wrote:
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.
Hard to tell exactly what you are talking about without an url.
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?


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

--
Spartanicus
Jul 21 '05 #2

"Spartanicus" <in*****@invalid.invalid> wrote in message
news:1u********************************@news.spart anicus.utvinternet.ie...
lk******@geocities.com wrote:
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.


Hard to tell exactly what you are talking about without an url.
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?


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

--
Spartanicus

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
Jul 21 '05 #3
"Baldy" <Ba***@poof.com> wrote:
I've always just remade my own h1 and h2 and h3s, call them something else,
to get rid of the spacing problem.


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
Jul 21 '05 #4
> 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.


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.

Jul 24 '05 #5
>> 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.

Jul 24 '05 #6
lk******@geocities.com wrote:
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.


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
Jul 24 '05 #7

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

15 posts views Thread by Eric | last post: by
12 posts views Thread by Stanimir Stamenkov | last post: by
2 posts views Thread by Knoxy | last post: by
14 posts views Thread by D. Alvarado | last post: by
36 posts views Thread by phil-news-nospam | last post: by
11 posts views Thread by sllrphoto | last post: by
14 posts views Thread by webEater | last post: by
13 posts views Thread by aarklon | last post: by
reply views Thread by mihailmihai484 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.