Hi Chris,
Absolute positioning places an element absolutely, with regard to its
containing box.
Also, when positioning within a container even though it is implicit,
its good to also specify position: relative; to the container's
selector. I'm not sure if this is in the spec or not, but browsers
will position relative to the viewport if you don't.
Also, you need a ; after you background image.
On Thu, 14 Oct 2004 10:56:49 -0700, Chris Kennon <[EMAIL PROTECTED]> wrote:
> In the following snippet, my thought on absolute positioning is
> div#disco is positioned absolutely with regards to div#containingbox.
> However my little experiment places this div in relation to the
> viewport. So absolute positioning takes a block level element out of
> its normal flow?
>
> What am I missing?
>
> <style type="text/css" media="screen">
> <!--
> body{
> margin: 0;
> padding: 0;
> background-color: #eee;
> background-image: url(images/base.jpg)
> color: 000;
> font: 80% Arial, Verdana, Geneva sans-serif;
> }
> #containingbox{
> border: 1px solid #666;
> background-color: fff;
> color: 000;
> width: 500px;
> padding: 5px;
> margin: 0px auto;
> text-align: justify;
> }
> div#disco{
> position: relative;
> top: 10px;
> left: 10px;
>
> }
>
> -->
> </style>
>
> <body>
> <div id="containingbox">
> <p>
> Lorem..
> </p>
> <div id="disco">
> <p>
> Lorem ..
> </p>
> </div>
> <p>
> Lorem ...
> </p>
> <p>
> Lorem ...
> </p>
> </div>
>
> </body>
>
> "Imagination is more important than knowledge."
> -Albert Einstein
>
> Chris
> http://ckimedia.com
>
> ******************************************************
> The discussion list for http://webstandardsgroup.org/
>
> See http://webstandardsgroup.org/mail/guidelines.cfm
> for some hints on posting to the list & getting help
> ******************************************************
>
>
--
Gmail invites - just ask nicely
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
