spazi tra div

**DarioMarco** · 11-03-2009, 15:59

Salve a tutti,
sto provando a convertire una tabella in css, ma non riesco a capire come mai il contenuto centrale, si stacca dagli altri:

codice:

<div style="width:169px">
	  			<div style="background-image:url(../Immaggini/sfondi/sfondoExtraMenu.gif); height:46px;">
		<p class="Stile11" style="border-top:5px; text-indent:40px">Menu:</p>
				</div>
				<div align="left" class="menu" style="background-image:url(../Immaggini/sfondi/sfondomenuCentro.gif); background-repeat:repeat">
				  <ul>[*]testo1
				[*]testo2
				[*]testo3[/list]
		   </div>
				<div style="background-image:url(../Immaggini/sfondi/sfondoMenuDown.gif); height:25px"></div>
		</div>

la tabella era settata come margin=0 cellpadding = 0 border=0

p.s. non fate caso all'errore immaggini

**Gufo** · 11-03-2009, 16:51

Originariamente inviato da DarioMarco
Salve a tutti,
sto provando a convertire una tabella in css, ma non riesco a capire come mai il contenuto centrale, si stacca dagli altri:

codice:

<div style="width:169px">
	  			<div style="background-image:url(../Immaggini/sfondi/sfondoExtraMenu.gif); height:46px;">
		<p class="Stile11" style="border-top:5px; text-indent:40px">Menu:</p>
				</div>
				<div align="left" class="menu" style="background-image:url(../Immaggini/sfondi/sfondomenuCentro.gif); background-repeat:repeat">
				  <ul>[*]testo1
				[*]testo2
				[*]testo3[/list]
		   </div>
				<div style="background-image:url(../Immaggini/sfondi/sfondoMenuDown.gif); height:25px"></div>
		</div>

la tabella era settata come margin=0 cellpadding = 0 border=0

p.s. non fate caso all'errore immaggini

Mi dici quante righe e quante colonne ha la tabella che vuoi convertire che vedo se riesco io

**DarioMarco** · 11-03-2009, 17:12

thnx! sei gentilissimo, ti posto il codice della tabella

codice:

<table width="100%" border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td height="46" align="center" valign="bottom" background="../Immaggini/sfondi/sfondomenuTop.gif">Menu:</td>
          </tr>
          <tr>
            <td background="../Immaggini/sfondi/SfondoExtraCentro.gif"><ul>[*]voce1[*]voce2[*]voce3[/list]</td>
          </tr>
          <tr>
            <td height="25" background="../Immaggini/sfondi/sfondoMenuDown.gif"></td>
          </tr>
        </table>

**Gufo** · 11-03-2009, 18:31

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>Documento senza titolo</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<style type="text/css">.tab-1 {
	border: none;
	height: 147px;
	position: relative;
	text-align: left;
	width: 981px;
}

.tab-1-1 {
	background-image: url('file:///C:/Immaggini/sfondi/sfondomenuTop.gif');
	border: none;
	height: 46px;
	left: 0px;
	padding: 0px;
	position: absolute;
	top: 0px;
	width: 981px;
}

.tab-1-2 {
	background-image: url('file:///C:/Immaggini/sfondi/SfondoExtraCentro.gif');
	border: none;
	height: 76px;
	left: 0px;
	padding: 0px;
	position: absolute;
	top: 46px;
	width: 981px;
}

.tab-1-3 {
	background-image: url('file:///C:/Immaggini/sfondi/sfondoMenuDown.gif');
	border: none;
	height: 25px;
	left: 0px;
	overflow: hidden;
	padding: 0px;
	position: absolute;
	top: 122px;
	width: 981px;
}
</style>
	</head>
	<body>
		<div class="tab-1">
			<div align="center" class="tab-1-1"><strong style="margin-top: 27px;">Menu:[/b]</div>
			<div class="tab-1-2">
				<ul style="margin-top: 9px;">
					[*]voce1 
					[*]voce2 
					[*]voce3 
				[/list]
			</div>
			<div class="tab-1-3"></div>
		</div>
	</body>
</html>

**DarioMarco** · 11-03-2009, 21:17

spe, pensavo funzionasse, ma se nel div tab-1-2 continuo a scrivere si accavalla con il tab-1-3 lo sfondo basso...

**Gufo** · 11-03-2009, 23:26

Originariamente inviato da DarioMarco
spe, pensavo funzionasse, ma se nel div tab-1-2 continuo a scrivere si accavalla con il tab-1-3 lo sfondo basso...

mmmmm! io l'ho provato e a me funziona bene! Ora riprovo e ti so dire

**DarioMarco** · 11-03-2009, 23:37

guarda, qualcosina, io la sto risolvendo, ma a dirti il vero, su ie tutto funziona a meraviglia, mentre su firefox, mi sta facendo perdere d'animo,
se vuoi ti posto il link:

http://www.calabriainvacanza.it/prova.asp#

ho dovuto cacciare i posizionamenti assoluti.

Grazie per la tua pazienza

**Gufo** · 11-03-2009, 23:38

Guarda questo è il risultato con il mio codice

e questo è il risultato con il tuo codice

**DarioMarco** · 11-03-2009, 23:54

a me sembrano gli stessi, forse dal mio pc si vede di meno, cmq ti posto anche io altri risultati:

questo risultato è corretto, visulizzato sotto ie:

mentre questo è visualizzato sotto firefox

**Gufo** · 12-03-2009, 00:07

Presumo delle differenze perchè il contesto è diverso e sicuramente nell'adattare il codice viene qualche errore, postami il codice del menu finito con le tabelle

Discussione: spazi tra div

Strumenti discussione

Ricerca discussione

Visualizza

spazi tra div

Re: spazi tra div

Permessi di invio