472,981 Members | 1,369 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,981 software developers and data experts.

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 3608
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 thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

15
by: Eric | last post by:
According to my book, the padding property is defined for all elements. However, when I set the property for the element <A>, only the left the right padding is applied and not the top and bottom...
12
by: Stanimir Stamenkov | last post by:
Here are two cases regarding inline-level elements' line-height, padding and background, which I doesn't understand: <div style="background: black; color: white; line-height: 1.5">...
2
by: Knoxy | last post by:
Hello, I've noticed one or two people post on this before but nobody seems to have replied so raising the issue again... is this a known IE6 CSS bug? I have placed the following in my...
17
by: lawrence | last post by:
How is it possible that the question "How do I detect which browser the user has" is missing from this FAQ: http://www.faqts.com/knowledge_base/index.phtml/fid/125 and is only here on this...
14
by: D. Alvarado | last post by:
Hello, I am trying to open a window containing an image and I would like the image to be flush against the window -- i.e. have no padding or border. Can I make this happen with a single call to a...
36
by: phil-news-nospam | last post by:
Here is a simpler (no drop shadows) example of the padding bug I see: http://phil.ipal.org/usenet/ciwas/2006-05-08/buttons-1.html So far I find nothing in the CSS2 document that says I should...
11
by: sllrphoto | last post by:
A veteran of early html, I've modified my blog template and made it look rather clean (albeit rather plain) when viewed with IE. Ironically, I'm a big Firefox fan, but when viewed in FF, my blog...
14
by: webEater | last post by:
I have a problem, it's not browser specific, and I don't get a solution. I have an (X)HTML document, I show you a part of it: .... <!--<div class="pad">--> <div id="eventImages"><img src=""...
13
by: aarklon | last post by:
Hi all, arrays are guaranteed to be contiguous with no padding before or after any array member , but what about enums ..???
0
by: lllomh | last post by:
Define the method first this.state = { buttonBackgroundColor: 'green', isBlinking: false, // A new status is added to identify whether the button is blinking or not } autoStart=()=>{
2
by: DJRhino | last post by:
Was curious if anyone else was having this same issue or not.... I was just Up/Down graded to windows 11 and now my access combo boxes are not acting right. With win 10 I could start typing...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 4 Oct 2023 starting at 18:00 UK time (6PM UTC+1) and finishing at about 19:15 (7.15PM) The start time is equivalent to 19:00 (7PM) in Central...
2
by: giovanniandrean | last post by:
The energy model is structured as follows and uses excel sheets to give input data: 1-Utility.py contains all the functions needed to calculate the variables and other minor things (mentions...
4
NeoPa
by: NeoPa | last post by:
Hello everyone. I find myself stuck trying to find the VBA way to get Access to create a PDF of the currently-selected (and open) object (Form or Report). I know it can be done by selecting :...
3
NeoPa
by: NeoPa | last post by:
Introduction For this article I'll be using a very simple database which has Form (clsForm) & Report (clsReport) classes that simply handle making the calling Form invisible until the Form, or all...
1
by: Teri B | last post by:
Hi, I have created a sub-form Roles. In my course form the user selects the roles assigned to the course. 0ne-to-many. One course many roles. Then I created a report based on the Course form and...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 1 Nov 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM) Please note that the UK and Europe revert to winter time on...
0
isladogs
by: isladogs | last post by:
The next online meeting of the Access Europe User Group will be on Wednesday 6 Dec 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, Mike...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.