Visualizzazione dei risultati da 1 a 3 su 3

Discussione: Altezza div auto ?

  1. #1
    Utente di HTML.it L'avatar di october
    Registrato dal
    Feb 2001
    residenza
    Torino
    Messaggi
    318

    Altezza div auto ?

    Ciao a tutti, vorrei porvi il mio banale problema, ho questa situazione:

    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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>D. I. V. </title>
    <style>
    .contenitore {
    	width: 100%;
    	border: thin solid #000;
    	background-color: #ffff00;
    }
    .blocco1 {
    	width: 200px; 
    	border: thin solid #000; 
    	height:200px;
    	background-color: #ff0000;
    }
    .blocco2 {
    	width: 200px; 
    	border: thin solid #000; 
    	height:200px;
    	background-color: #00ff00;
    }
    .blocco3 {
    	position:relative;
    	float: right;
    	width: 200px; 
    	border: thin solid #000; 
    	height: 200px;
    	background-color: #0000ff;
    }
    </style>
    </head>
    <body>
    
    <div class="contenitore">
        <div class="blocco1">BLOCCO 1</div>     
        <div class="blocco2">BLOCCO 2</div> 
        <div class="blocco3">BLOCCO 3</div>
    </div>
    
    
    </body>
    </html>
    Perchè il blocco 3 risulta essere fuori dal contenitore ?
    Ovvero perchè al contenitore non si allunga l'altezza ?

    Grazie.

  2. #2
    Moderatore di Javascript L'avatar di ciro78
    Registrato dal
    Sep 2000
    residenza
    Napoli
    Messaggi
    8,509
    se ho capito bene cosa vuoi fare prova questo

    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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>D. I. V. </title>
    <style>
    .contenitore {
    	width: 100%;
    	border: thin solid #000;
    	background-color: #ffff00;
    }
    .blocco{float:left;}
    .blocco1 {
    	width: 200px; 
    	border: thin solid #000; 
    	height:200px;
    	background-color: #ff0000;
    }
    .blocco2 {
    	width: 200px; 
    	border: thin solid #000; 
    	height:200px;
    	background-color: #00ff00;
    }
    .blocco3 {
    	position:relative;
    	float:left
    	width: 200px; 
    	border: thin solid #000; 
    	height: 200px;
    	background-color: #0000ff;
    }
    .clear{clear:both}
    </style>
    </head>
    <body>
    
    <div class="contenitore">
    		<div class="blocco">
        <div class="blocco1">BLOCCO 1</div>     
        <div class="blocco2">BLOCCO 2</div> </div>
        <div class="blocco3">BLOCCO 3</div>
        <hr class="clear" />
    </div>
    
    
    </body>
    </html>
    Ciro Marotta - Programmatore JAVA - PHP
    Preferisco un fallimento alle mie condizioni che un successo alle condizioni altrui.


  3. #3
    Utente di HTML.it L'avatar di october
    Registrato dal
    Feb 2001
    residenza
    Torino
    Messaggi
    318
    Grazie, ci provo.

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 © 2024 vBulletin Solutions, Inc. All rights reserved.