Visualizzazione dei risultati da 1 a 3 su 3
  1. #1

    Layout 2 colonne: come ottenere la stessa altezza

    Ciao,

    sto lavorando con un layout a 2 colonne.
    La colonna di sinistra vorrei che prendesse tutto lo spazio disponibile in verticale. Finora pero' non ci sono riuscito. La causa penso sia l'utilizzo della proprieta' float sulla colonna in questione ma non saprei come altro fare per posizionare due colonne affiancate.

    Quindi la domanda e': e' possibile far prendere alla colonna di sinistra tutto lo spazio disponibile in verticale?

    Il codice di esempio semplificato della pagina e' il seguente:

    Layout.css
    codice:
    /* CSS Document */
    html, body
    {
    	margin: 0;
    	padding: 0;
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: x-small;
    	background: #EEEEEE; 
    	/*background-repeat: repeat;*/
    	text-align: center;
    }
    
    #main
    {	
    	margin: 0 auto 5px auto;
    	padding: 0;
    	width: 770px;
    	background: white;
    	position: relative;
    	height: auto;
    }
    
    #header
    {	
    	margin: 0;
    	padding: 0;
    	height: 150px;
    	background: black;
    	text-align: left;
    }
    
    #centro
    {	
    	margin: 5px 25px 5px 220px;
    	padding: 0px;
    	text-align: left; 
    	min-height: 400px;	
    }
    
    #mybar
    {
    	/* menu sinistra */	
    	margin: 0px 5px 5px 0px;
    	padding: 5px 5px 5px 5px;
    	width: 200px;
    	height:auto;
    	float: left;	
    	text-align: left;
    	background: #EDEAE3;	
    }
    
    #footer
    {
    	margin: 0;
    	padding: 0;
    	text-align: center;
    	clear: both;
    	height: 37px;
    	background: black;
    	color: white;
    	line-height: 25px;
    }
    index.html
    codice:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head><title>Prova</title>
    <link href="Layout.css" type="text/css" rel="stylesheet" /></head>
    <body>
            <div id="main">
                <div id="header"></div>
                <div id="mybar">
                	testo laterale
                </div>
                <div id="centro">                
    	 <h2>Benvenuto</h2>
    	 
    
    bla bla bla </p>        
    	</div>
                <div id="footer"></div>
            </div> 
    </body>
    </html>
    Grazie
    Saluti a tutti
    Riccardo

  2. #2
    Utente di HTML.it
    Registrato dal
    Sep 2001
    Messaggi
    21,188
    fai una ricerca nel forum (bottone in alto) con la chiave: "false colonne". In alternativa puoi fare una ricerca in rete, eventualmente con la chiave "faux columns"
    Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
    No domande tecniche in messaggi privati

  3. #3

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2026 vBulletin Solutions, Inc. All rights reserved.