Fwd: [UPHPU] Good CSS two-column layout?

Fri Feb 15 08:26:46 MST 2008

---------- Forwarded message ----------
From: Nathan Lane <nathamberlane at gmail.com>
Date: Fri, Feb 15, 2008 at 8:26 AM
Subject: Re: [UPHPU] Good CSS two-column layout?
To: Walt Haas <haas at xmission.com>

In the container div, for some reason that margin trick didn't work to float
the div to the center in IE7 - it works on Google's Blogger though - you
could use Firebug to check it out on a Blogger blog site, and see what style
they use to float their container div to the center.

On Fri, Feb 15, 2008 at 8:22 AM, Nathan Lane <nathamberlane at gmail.com>
wrote:

> Two columns?  If you don't define the height css property of a div, and
> don't define the overflow property, then the div will automatically size -
> if there is no content, then in Firefox you won't see the div, and in IE you
> will see a div with the default line-height as the height, but ultimately
> the contents would determine how high it goes.  On my website (
> http://nathandelane.awardspace.com) I have a single column that does this
> with simple css - no hacks involved.
>
> <html>
>     <head>
>         <style>
>             .column {
>                 width: 300px;
>                 float: left;
>                 margin-left: 10px;
>                 margin-right: 10px;
>             }
>         </style>
>     </head>
>     <body>
>         <div id="container" style="margin: 0px auto;width: 640px">
>             <div id="div1" class="column" style="background-color:
> #000000;">
>                 Hello div 1
>             </div>
>             <div id="div2" class="column" style="background-color:
> #606060;">
>                 Hello div 2
>             </div>
>         </div>
>     </body>
> </html>
>
> Does that work for you?
>
>
> On Fri, Feb 15, 2008 at 7:49 AM, Walt Haas <haas at xmission.com> wrote:
>
> > Wade Preston Shearer wrote:
> > >> Does anybody know of a way to solve the two-column layout problem
> > >> without using either a table or ugly non-portable looking CSS hacks?
> > >
> > > Will any of these offer assistance?
> > >
> > > http://anavidesign.com/examples/css_layouts/
> > >
> >
> > They use the repeating background image approach.  That approach works
> > OK if you can guarantee that a simple image will do the trick.  I was
> > hoping to find something a little more general.
> >
> > Thanks  -- Walt
> >
> >
> > _______________________________________________
> >
> > UPHPU mailing list
> > UPHPU at uphpu.org
> > http://uphpu.org/mailman/listinfo/uphpu
> > IRC: #uphpu on irc.freenode.net
> >
>
>
>
> --
> Nathan Lane
> Home, http://nathandelane.awardspace.com

-- 
Nathan Lane
Home, http://nathandelane.awardspace.com

-- 
Nathan Lane
Home, http://nathandelane.awardspace.com