I posted a similar question yesterday, but didn't get an answer that
resolved the issue. (Thanks to those who tried though.)
The background: I've read in books and online that if you have one
element with "relative" positioning, such as a <div>, it creates a
"positioning context" for element within it. E.g., if you have a <p>
inside your <div> you can give it absolute positioning and position it
(right, left, top, bottom) in terms of the <div> -- not in terms of the
browser window. So in this scenario...
.... the <p> will not be positioned 20 by 20 pixels from the window upper
left (assume the <div> is somewhere lower down in the page). It will be
located those dimensions in relation to the upper left corner of the
<div>. And that's supposed to work in all up-to-date browsers from what
I've read.
However, I can't get it to work.
Here is some code from a page I'm trying to design:
Note that the word "Home" is OUTSIDE of the <div> and not located where
intended: inside the <div> near the right edge, lined up at the same
vertical level as the <h1> element with "ASA Notes" in it.
So do the supposed CSS positioning "rules" have any validity? Or is the
problem that I'm not understanding them correctly? Or have I made some
syntax error?
By the way, I also tried achieving the desired effect using the "float"
property, but that didn't work either.
I checked that the document is valid XHTML 1.0 strict.
Any help would be greatly appreciated.
Posted by Toby Inkster on September 26, 2004, 2:58 pm
Please log in for more thread options
rajek wrote:
> And the resulting output in IE and Mozilla is here:
> http://www.somerandomcrap.com/temp/cssscreenshots.htm
In this case it just looks like you've triggered an IE bug (there are
many). You could probably acheive the desired effect using
text-align:right instead.
--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact Now Playing ~ ./white_town_-_your_woman.ogg
Posted by rajek on September 26, 2004, 12:09 pm
Please log in for more thread options
Toby Inkster wrote:
> rajek wrote:
>
>
>>And the resulting output in IE and Mozilla is here:
>>http://www.somerandomcrap.com/temp/cssscreenshots.htm >
>
> In this case it just looks like you've triggered an IE bug (there are
> many). You could probably acheive the desired effect using
> text-align:right instead.
>
Thanks for the reply. However, note that the problem occurs in Mozilla
as well -- not just IE. Also, the desired effect (refer to my original
post for a description of that) would not be achieved using "text-align:
right".
Posted by Toby Inkster on September 27, 2004, 7:35 am
Please log in for more thread options
rajek wrote:
> Also, the desired effect would not be achieved using "text-align: right".
What about floating?
http://examples.tobyinkster.co.uk/floatyfloaty.strict
--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact
Posted by DM on September 27, 2004, 10:03 am
Please log in for more thread options
Toby Inkster wrote:
> rajek wrote:
>
>>Also, the desired effect would not be achieved using "text-align: right".
>
>
> What about floating?
> http://examples.tobyinkster.co.uk/floatyfloaty.strict >