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

    qualquno mi puo aiutare

    Premettendo che sono un autodidatta vorrei cominciare ad usare i css al posto delle tabelle per realizzare il mio layout. Nel seguente codice cosa devo metterci per implementare due box all'interno di quello principale.

    <!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" xml:lang="it" lang="it" dir="ltr">
    <head>

    <title>Centrare verticalmente un oggetto in un contenitore</title>

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <style type="text/css" media="screen">

    html, body{
    margin:0;
    padding:0;
    font-family: "Trebuchet MS", Georgia, Verdana, sans-serif;
    text-align:center;
    }

    #container {
    margin: 20px auto;
    padding:0;
    position:relative;
    width:750px;
    height:750px;
    background:#FFFFFF;
    letter-spacing: normal;
    text-align: center;
    vertical-align: middle;
    word-spacing: normal;
    border-top: 2px solid #999999;
    border-right: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
    border-left: 2px solid #999999;
    top: 1px;
    }

    #container2{
    position:relative;
    left:0px;
    top:0px;
    background:#666666;
    width:200px;
    height:99px;
    }

    </style>

    </head>


    <body>
    <div id="container">
    <div id="container2">
    <div align="left">[img]../Hintergrund/HEADER.jpg[/img]
    </div>
    </div>
    </div>

    </body>
    </html>

    GRZAIE A TUTTI

  2. #2
    ma gli hai gia' usati i css.

    Cosa intendi ?
    Nulla è impossibile. Il difficile è trovare la soluzione che renda l'impossibile possibile...
    http://www.eternaldream.it

  3. #3
    Molto poco é una delle prime volte

  4. #4
    Vorrei solo mettere all'interno dello container grandi altri due piccoli box

  5. #5
    ciao...e' questo quelllo che vuoi ?
    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" xml:lang="it" lang="it" dir="ltr"> 
    <head> 
     
    <title>Centrare verticalmente un oggetto in un contenitore</title> 
     
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
    <style type="text/css" media="screen"> 
    
    html, body{ 
    margin:0; 
    padding:0; 
    font-family: "Trebuchet MS", Georgia, Verdana, sans-serif; 
    text-align:center; 
    } 
    
    #main { 
    	position:absolute; 
    	margin-top:15px;
    	left:130px;
    	width:750px; 
    	height:750px; 
    	background:#FFFFFF; 
    	text-align:left;
    	letter-spacing: normal; 
    	word-spacing: normal; 
    	border:2px solid red; 
    } 
    
    #banner{ 
    	position:relative; 
    	margin-top:0;
    	margin-left:0;
    	background:#666666; 
    	width:100%; 
    	height:99px; 
    } 
    #container{
    	position:absolute;
    	border:1px solid blue;
    	width:300px;
    	height:400px;
    	margin-top:100px;
    	margin-left:30px;
    	padding:2px;
    	font-family:Arial, Helvetica, Time New Roman;
    	font-size:10pt;	
    }
    
    #container2{
    	position:absolute;
    	border:1px solid blue;
    	width:300px;
    	height:400px;
    	margin-top:100px;
    	margin-left:410px;
    	padding:2px;
    	font-family:Arial, Helvetica, Time New Roman;
    	font-size:10pt;	
    }
    
    </style> 
     
    </head> 
    
    
    <body> 
    <div id="main"> 
    <div id="banner">[img]../Hintergrund/HEADER.jpg[/img]</div> 
    <div id="container">Questo e' i ltesto del contenitore uno</div>
    <div id="container2">Questo invece lo e' del contenitore 2</div>
    </div> 
    
    
    </body> 
    </html>
    Se si, io ti consiglierei di inserire il codice dei css su un file a parte chiamato style.css ed importarlo nel documento con la sintassi
    codice:
    <style>\n";
      @import url(style.css);
    </style>\
    ciao a presto.
    Nulla è impossibile. Il difficile è trovare la soluzione che renda l'impossibile possibile...
    http://www.eternaldream.it

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.