Perchè il testo nel div me lo visualizza affiancato all'altro div?

**D4rkAng3l** · 18-09-2007, 14:22

Allora il problema è il seguente: ho questo template che stò sviluppando. E' un template monolitico fisso dove ogni zona è gestita da un div con un relativo id

C'è il div header per l'header: l'immagine col titolo
C'è un div navigation sottostante per il menu principale
Sotto a navigation c'è un div gallery (che conterrà un menu di navigazione per le varie gallerie delle immagini)
sotto c'è il div content che contiene il contenuto vero e proprio della pagina
e infine i div footer col footer

Il problema sorge proprio quando sono andato ad inserire il div gallery (forse dipende perchè il menu principale ha qualche impostazione nei CSS...booo)...praticamente non mi mette il div gallery sotto al div navigation ma me lo affianca in qualche modo strano che non capisco...

Il codice HTML è:

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it" lang="it">
<head>
<title>Andrea Nobili Fotografo</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<link href="default01f.css" rel="stylesheet" type="text/css" title="default" />
</head>

<body>

	<div id="header">
	<h1>Andrea Nobili Fotografo</h1>
	</div>

	<div id="menu">
			<ul>
			[*]Home
			[*]About Me
			[*]Portfolio
			[*]Contact
			[*]Links
			[/list]
	</div>

        <div id="gallery">Prova</div>

        <div id="content">
	<h1>Pagina in costruzione</h1>

	<h2>1.PARAGRAFO</h2>
	
	


	Lorem ipsum dolor sit amet, consectetuer adipiscing elit.  ...
	</p>
	
	<h2>2.PARAGRAFO</h2>
	
	


	Vivamus mattis nisi id pede. Nunc rhoncus mauris quis  ...
	</p>
	
	<h2>3.PARAGRAFO</h2>
	
	


	Sed mollis dolor nec est. Integer iaculis nonummy lorem.  ...
	</p>

</div>

<div id="footer">This Page Is Valid XHTML 1.0 Strict and Valid CSS v.2

No tables have been used to make this layout

</div>

</body>
</html>

il codice CSS è:

codice:

}
#content h2{
	background: #fff;
	color: #940D1E;
	padding-bottom: 0.3em;
	font: normal 150% Georgia, "Times New Roman", Times, serif;
	border-bottom: 1px dotted #FF9006;
}
#content a:link, #content a:visited {
	font-size: 95%;	
	font-weight: normal;
	color: #41545F;
	background-color: #fff;
	text-decoration: underline;
}
#content a:hover {
	color: #fff;
	background-color: #41545F;
	text-decoration: none;
}
#footer{
	margin: 0 auto;
	width: 740px;
	background: #41545F;
	text-align: center;
	color: #fff;
	border: 1px solid #000;
	border-top: 1px;
	border-bottom: 1px;
	font-family: helvetica, arial, verdana, tahoma, sans-serif; 
	padding: 0.8em 0.8em;
}
#footer a:link, #footer a:visited {
	color: #fff;
	background-color: #41545F;
	text-decoration: underline;
}
#footer a:hover {
	text-decoration: none;
	color: #41545F;
	background-color: #fff;
}

Il risultato errato è visibil quà:
http://www.siatec.net/andrea/prove/gallerie.html

Perchè? che devo fare per farlo stare bene?

Grazie
Andrea

**fcaldera** · 18-09-2007, 14:41

perchè hai messo i vari[*] flottati e, di conseguenza il menu che li racchiude perde le dimensioni
(IE6 a parte)

aggiungi a default01f.css (line 51)

codice:

#menu ul {               
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0pt;
padding-left:0pt;
overflow:hidden;
height:auto;
}

Se posso ti suggerisco di leggere le guide utili e i tutorial sul posizionamento e sul box model che si trovano tra i link utili in evidenza

**D4rkAng3l** · 18-09-2007, 15:07

ti ringrazio, ora provo...li ho lette le guide ma mi trovo cmq in difficoltà (magari sò scemo io) perchè quando mi metto a fare le cose mi sfugge sempre qualcosa, avevo sospettato che dipendesse dalle impostazioni sui li dove uso la display ma era solo un vago presentimento.
Ora stavo pensando anche di comprarmi un libro sui CSS...anche il fatto di avere una cosa cartacea magari aiuta (a leggere sul monitor dopo un po' divento pazzo)

Cmq che fa esattamente quelle due righe che mi hai dato da aggiungere?

Grazie
Andrea

Discussione: Perchè il testo nel div me lo visualizza affiancato all'altro div?

Strumenti discussione

Ricerca discussione

Visualizza

Perchè il testo nel div me lo visualizza affiancato all'altro div?

Permessi di invio