Aiuto con i div

  • Creatore Discussione Creatore Discussione GennyX
  • Data di inizio Data di inizio

GennyX

Utente Attivo
Buongiorno a tutto il Forum,
è circa una settimana che mi sto scervellando su come realizzare una pagina web con i div. FIn'ora ho sempre e solo utilizzato i CSS, ma ora vorrei provare con i div.

Vi spiego velocemente cosa vorrei fare:
• pagina 850px divisa in 2 colonne: sx 180px - dx 670px
• nella colonna dx (670px) vorrei creare una tabella di 640px centrata
• la tabella di 640px centrata dovrebbe essere divisa in 5 righe
• la prima riga contiene testo
• la seconda riga contiene immagini una di seguito l'altra
• la terza riga contiene 4 immagini una di fianco l'altra
• la quarta riga solo testo
• la quinta e ultima contiene 4 pulsanti uno di fianco l'altro

• una riga sotto la tabella blu con un'immagine di sfondo.

In allegato vi metto una foto su come dovrebbe essere
http://www.offerte-hotel-ischia.com/foto.jpg

Ringrazio tutti anticipatamente
 
Ultima modifica:
ciao
io farei così

HTML:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Documento senza titolo</title>
<style type="text/css">
<!--
html{
margin:0px;
padding:0px;}
body{
margin:0px;
padding:0px;
font-family: Arial, Helvetica, sans-serif;
}
#contenitore{
background-color: #0066FF;/*messi colori per evidenziare*/
width:850px;
height:450px;/*oppure auto*/
top: 5px;/*se vuoi centrare in altezza metti 50%*/
left: 50%;
margin-left: -425px;/*la metà della larghezza*/
/*margin-top:-metà dell'altezza px;*/
position: absolute;
}
#sinistro{
background-color: #FFFF99;/*messi colori per evidenziare*/
width:180px;
height:300px;/*quello che ti serve o auto*/
position: absolute;
top: 0px;/*posizioni il div in alto e a sinistra*/
left:0px;
}
#destro{
background-color: #CCFF66;/*messi colori per evidenziare*/
width:670px;
height:400px;/*quello che ti serve o auto*/
position: absolute;
top: 0px;/*posizioni il div in alto e a destra*/
right:0px;
}
td.bck{
background-image:url(cartella/tua_immagine.jpg);
background-repeat:no-repeat;
background-position:center center;
height:50px;/*altezza in px dell'immagine*/
}
-->
</style>

</head>

<body>
<div id="contenitore">
	<div id="sinistro">aaaaaaaaaa<br>bbbbbbbbbbbb</div>
	<div id="destro">
	  <table width="670" border="0" align="center" cellpadding="0" cellspacing="0">
        <tr>
          <td><p>testo</p>
          <p>testo</p></td>
        </tr>
        <tr>
          <td>foto foto foto foto </td>
        </tr>
        <tr>
          <td>testo testo </td>
        </tr>
        <tr>
          <td>pulsanti</td>
        </tr>
        <tr>
          <td class="bck">immagine di bck </td>
        </tr>
      </table>	
    </div>
</div>
</body>

perà il css lo metteri esterno
 
Ti ringrazio Borgo Italia,
ma la cosa che volevo è creare anche la tabella con i div...
sai per renderelapagina più leggera poichè devo inserire un bel pò di argomenti.

Mi puoi dare ua mano a creare la tabella in div?

Ti ringrazio anticipatamente... :)
 
ciao
è semplice
togli la <table><tr><td></td>.... </tr></table>
all'inerno del <div id="destro">.....</div>
costrucisci

<div id="testo1">.....</div>
<div id="foto">.....</div>
<div id="testo2">.....</div>
<div id="pulsanti">.....</div>
<div id="con_bck">.....</div>

con le misure che vuo dargli, secondo me widt=a quella del div destro, e che la somma delle varie altezze sia quella del div destro, poi, eventualmente dagli il float (vuoto di memoria) che ciascun div non possa evere altri div a destra.

p.s.
comunque io lascerei la tabella, dovresti avere meno problemi con i vari bw
 

Discussioni simili