[thelist] aligning boxes flush

[Murphy, William]

Why dont you try right: 10% (or whatever you like) instead of the left
propery in both of them.

#box1 {
    position: absolute;
    top: 15%;
    right: 10%;
    height: 5%;
    width: 12%;
    border: 1px solid #ffffff;
    color: #ffffff;
    text-align: center;
    background-color: #000000;
    font-size: 12pt;
    z-index: 1;
    }
#box2 {
    position: absolute;
    top: 20%;
    right: 10%;
    min-height: 70%;
    width: 65%;
    border: 1px solid #ffffff;
    background-color: #000000;
    overflow: hidden;
    }


By the way, i'm working on it, and it's in spanish, but i accept coments and
sugestions on my site http://litio.net .

----- Original Message -----
From: "sten" <lists at redboy.cx>
To: <thelist at lists.evolt.org>
Sent: Sunday, June 22, 2003 12:10 AM
Subject: [thelist] aligning boxes flush


> Hi,
>
> I'm trying to align to div's so that the bottom of one is flush the th top
> of the other. ASCII art example:
>        ___________
>        | box1    |
> -------          |
> |     box2       |
> ------------------
>
> I've been trying to use absolute positioning and percentages to lign the
> boxes up:
>
> #box1 {
> position: absolute;
> top: 15%;
> left: 56%;
> height: 5%;
> width: 12%;
> border: 1px solid #ffffff;
> color: #ffffff;
> text-align: center;
> background-color: #000000;
> font-size: 12pt;
> z-index: 1;
> }
> #box2 {
> position: absolute;
> top: 20%;
> left: 3%;
> min-height: 70%;
> width: 65%;
> border: 1px solid #ffffff;
> background-color: #000000;
> overflow: hidden;
> }
>
> This works in Mozilla, but not in IE. Also, text, especially if I change
> the font size in the boxes, seems to throw the alignment off.
>
> There's gotta be a better way to do this. Suggestions?
>
> -sten
> --
> * * Please support the community that supports you.  * *
> http://evolt.org/help_support_evolt/
>
> Evolt.org conference in London, July 25-27 2003.  Register today at
http://evolt.org.uk
>
> For unsubscribe and other options, including the Tip Harvester
> and archives of thelist go to: http://lists.evolt.org
> Workers of the Web, evolt !
>