Flying Saucer: Layouts

2 Column Fluid Layout with Fixed Menu

Uses ideas from Intensiv Station Templates http://www.intensivstation.ch

This is a 2-column fluid layout with a fixed-size menu on the left. The content has a left margin of 200px, but expands to fill space to the right; the menu has a fixed 200px width. Content is auto-overflow. Again, we don't set a color on the menu because we'd have a problem with sizing it vertically; so the menu gets the color of the page background.

Note in this example the layout will break because of the "pre" block below--but holds up pretty well till you reduce beyond the minimum necessary for the preserved formatting.

        body {
        background-color: #e1ddd9;
        font-size: 12px;
        font-family: Verdana;
        color:#564b47;
        padding:0px 20px;
        margin:0px;
        }

        #content {
        margin-left: 200px;
        background-color:#fff;
        overflow: auto;
        }

        #menu {
        position: absolute;
        width: 200px;
        left: 20px;
        padding:0px;
        margin:0px
        }

    

Por efika lingvoinstruado Plurlingveco La Esperantokomunumo estas? Homa emancipigxo projekto por ebligi al cxiu homo partopreni kiel individuo en la. Por la provizo de tiu sxanco Lingvaj rajtoj La malegala disdivido de. Kies parolantoj estas senescepte du aux plurlingvaj Cxiu komunumano akceptis la taskon lerni. En kursoj por la lingva! Grandan diversecon de lingvoj en la mondo kiel baron al komunikado!