Stylesheets - Absolute positioning in a <div>?

Author

Absolute positioning in a <div>?

Gustaf Liljegren

2004-08-21, 4:34 am

Here's what I'm trying to achieve:

1. A <div>, centered on screen, 600px wide and 100px high, with a
background-image (also 600 x 100).
2. Text (an <h1> element) positioned with precision inside the <div>, on
the image.
3. A similar result in IE and FF...

Here's some of the XHTML:

<body>
<div id="container">
<div id="top">
<h1>Title</h1>
</div>
...
</div>
</body>

Here are selected parts of my CSS:

body {
text-align: center;
...
}

#container {
width: 600px;
...
margin-right: auto;
margin-left: auto;
...
padding: 0px;
}

#top {
width: 600px;
height: 100px;
background-image: url('banner.png');
...
padding: 0px;
}

#top h1 {
...
}

I can't figure out how to position the text in '#top h1'. I want it,
say, 30px from the top of #top and 20px from the left border of #top. So
it seems I need to use absolute positioning, but only inside the #top
<div>. Hope it's possible...

Gustaf

Gustaf Liljegren

2004-08-21, 4:34 am

Alan J. Flavell wrote:

[color=darkred]
> You really have to make up your mind whether your targets are people
> (good) or computers (ungood).

I'm pretty sure that if someone would watch my site on a screen less
than 640 x 480, they'll have a way better experience than on the average
site out there. If my default style doesn't suit my users, the pages are
completely readable and well structured without it.

> You proved my point, it seems. You're still showing lack of
> understanding that flexible design is for people - you seem to think
> it's only for dealing with buggy browsers.

I hoped mentioning Web Accessibility would prove my concern for this.
I'm just not prepared to go through any lengths only to make the site
accessible to the last 0.5 perecent.

> I've no objection to you making your web page look the way you wanted
> it to look, in the narrow range of display situations which you
> consider to be the majority.

It's not about what I consider, but about the statistics. Have a look:

http://www.w3schools.com/browsers/browsers_stats.asp

My guess is that the figures shown here are even more heterogeneous than
average (because it's a technical site, and advanced users are more
likely to use something other than IE5 at 800 x 600). But the lession I
learn from this is that the world is not so diverse at all, and it makes
perfect sense to do what works for the great majority.

Gustaf

Brian

2004-08-22, 7:17 pm

Gustaf Liljegren wrote:

> Spartanicus wrote:
>
>
> Because [...] it's recommended by the W3C.

HTML is also recommended by the W3C:

<quote source: http://www.w3.org/TR/html4/ >
HTML 4.01 Specification
W3C *Recommendation* 24 December 1999
</quote>

[emphasis is mine]

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/