2 colonne

**remixe** · 06-05-2007, 09:07

ciao,
ho un layout fatto esclusivamente con i css, tutto allineato a sinistra.
Quando "allargo" la finestra del browser i contenuti testuali si allargano di conseguenza e fin
quì tutto bene.
Ora..ho l'esigenza (in una pagina del sito) di disporre il contenuto testuale su 2 colonne,
l'effetto finale dovrebbe comunque restare come quello delle altre pagine, e cioè quando allargo la finestra del browser, anche qui il testo delle 2 colonne dovrebbe allargarsi.
Come si fa però a far disporre il testo su 2 colonne (senza tabelle ovviamente :-)) ) ?

GRAZIE

**fcaldera** · 06-05-2007, 13:46

usa dimensioni percentuali

codice:

<style type="text/css">
#wrapper        { width: 90%; height: auto; overflow: hidden; }
#wrapper div    { float: left; display: inline; width: 48%; border : 1px solid #767676; }
</style>

<body>

<div id="wrapper">
    <div>
        


        colonna 1

        Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
        Suspendisse porttitor ultrices magna. Praesent dapibus, ante 
        eget porttitor facilisis, diam lectus eleifend est, at mollis 
        enim nisi eu augue. Donec hendrerit, urna sit amet laoreet 
        adipiscing, pede quam consectetuer libero, ut tincidunt lectus 
        libero sed sapien. Fusce feugiat pede ut tortor. 
        Nullam pellentesque gravida velit. Pellentesque pharetra. 
        Maecenas elit orci, molestie sit amet, aliquam a, tristique sed, 
        dui. 
        </p>
    </div>
    
    <div>
        


        colonna 2

        Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
        Suspendisse porttitor ultrices magna. Praesent dapibus, ante 
        eget porttitor facilisis, diam lectus eleifend est, at mollis 
        enim nisi eu augue. Donec hendrerit, urna sit amet laoreet 
        adipiscing, pede quam consectetuer libero, ut tincidunt lectus 
        libero sed sapien. Fusce feugiat pede ut tortor. 
        Nullam pellentesque gravida velit. Pellentesque pharetra. 
        Maecenas elit orci, molestie sit amet, aliquam a, tristique sed, 
        dui. 
        </p>
    </div>

</div>

Ciao

**remixe** · 07-05-2007, 08:33

ciao fcaldera e grazie innanzitutto.
ho testato il codice che mi hai digitato nella mia pagina e funziona benissimo.
un unica cosa non riesco a risolvere, e cioè nonostante ci sia la regola "float:left"
le 2 colonne non mi si allineano completamente a sinistra (accanto al menù laterale),
ma rimangono troppo centrate nella mia pagina.
A cosa può esser dovuto?

Ciao e grazie ancora.

**fcaldera** · 07-05-2007, 09:14

probabilmente
- ad un text:align diverso da left sul loro contenitore, oppure
- alla presenza di un padding o margin sugli elementi antenati

se usi firefox e firebug puoi evidenziare gli elementi della pagina e controllarne le proprietà css fino a che non trovi quella che genera il problema

**remixe** · 07-05-2007, 10:11

ciao,
si era come dicevi tu..ora ho risolto...si allinea bene a sinistra.
Un ultima cosa: ho notato che tra le 2 colonne c'è troppo spazio, come posso fare
per diminuirlo?

grazie ancora

Discussione: 2 colonne

Strumenti discussione

Ricerca discussione

Visualizza

2 colonne

re

re

Permessi di invio