Visualizzazione dei risultati da 1 a 5 su 5

Discussione: CSS BOX :-?

  1. #1

    CSS BOX :-?

    Vorrei realizzare dei box come riportato nell'allegato (vedi foto: demo.gif) evitando le tabelle e utilizzando unicamente i CSS, ho fatto molte prove ma non riesco ad affiancare il secondo box interno (contained_right) mi
    risulta sempre sotto il primo (contained_left).

    la struttura:
    container: --------> il box esterno
    contained_left: ---> primo box interno (quello a sinistra)
    contained_right: --> secondo box interno (quello a destra “in teoria”)


    il codice:
    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=iso-8859-1" />
    <title>test box css</title>
    <style type="text/css">
    <!--
    html,body,home{
    	margin: 0;
    	padding: 0;
    	height:100%;
    	background-color: #F1F0DE;
    	text-align: center; 
    }
    .container {
    	margin: 0 auto;
    	height: 370px;
    	width: 714px;
    	border: 1px solid #997B62;
    	position: relative;
    }
    .contained_left {
    	height: 348px;
    	width: 130px;
    	margin: 10px;
    	border: 1px solid #997B62;
    	position: relative;
    }
    .contained_right {
    	height: 348px;
    	width: 549px;
    	margin: 10px;
    	border: 1px solid #997B62;
    	position: relative;
    }
    -->
    </style>
    </head>
    <body>
    	<div class="container">
    		<div class="contained_left"></div>
    		<div class="contained_right"></div> 
    	</div>
    </body>
    </html>
    cichity74
    Immagini allegate Immagini allegate

  2. #2
    Utente di HTML.it L'avatar di floyd46
    Registrato dal
    Feb 2002
    residenza
    Apulia
    Messaggi
    2,641

    Re: CSS BOX :-?

    quello che chiedi (e che hai inserito nell'allegato) è fattibilissimo con i CSS. Dovresti usare la regola di Tantek (il box model, per intendeci) oppure usare qualche altro hack che ti faccia
    visualizzare correttamente la struttura che vuoi.
    ciao
    P.S. regola di Tantek = www.tantek.com
    "Le persone che realizzano layout con tabelle annidate, spacer gif o che ignorano l'accessibilità non possono più definirsi professionisti." Andy Clarke
    --------------------------------

    www.extrowebsite.com

  3. #3
    ti rifericsi a questo
    link: http://www.tantek.com/CSS/Examples/boxmodelhack.html

    Non tratta la nidificazione dei box...
    hai qualche altra risorsa utile da indicarmi :rollo:

    cichity74

  4. #4
    Utente di HTML.it L'avatar di floyd46
    Registrato dal
    Feb 2002
    residenza
    Apulia
    Messaggi
    2,641
    il link è proprio quello; non intendevo la nidificazione dei box, ma segnalarti la pagina per fare in modo che 2 div stiano affiancati e nn uno sotto l'altro (nel tuo caso specifico).
    E' la regola fondamentale del box model.
    Se hai altri problemi, posta ancora.
    ciao
    "Le persone che realizzano layout con tabelle annidate, spacer gif o che ignorano l'accessibilità non possono più definirsi professionisti." Andy Clarke
    --------------------------------

    www.extrowebsite.com

  5. #5
    grazie
    cichity74

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