<h2> scrive una riga in più!

**Whitecrowsrain** · 06-09-2007, 12:25

Salve
questa mattina stavo realizzando la struttura di un sito quando ecco che si presenta un problema , quando metto un tag h2 dentro un div mi stampa una riga sopra di esso della stessa dimensione di h2 ma vuoto e che ha come sfondo il bk del body ( e non del div)

VVoVe: come mai mi succede questo?

codice HTML:

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="en" lang="it">
<head>
  ...
</head>
<body >
  <div id="container">
    <div id="header">
    </div>
    <div id="contenuti">
              <h2> Login Aministrazione </h2>
            

Inserisci i dati dell'amministratore</p>

    </div>
    <div id="menu_dx">
     
    </div>
    <div id="piede">

    </div>
  </div>
</body>
</html>

file .css

codice:

/* Sezioni Generiche */
html,body
{
  margin: 0;
  padding:0;

}
h2
{
  margin-top:0;
  padding-top:0;
  text-align:center;
  font-size: 1.6em;
  font-family:"Verdana";
}
body
{

  text-align:center;
  font-family: Arial,Helvetica,Sans-serif;
  font-size: 76%;
  background-color:#DEDEDE;

}
/*contenitore contenuti */
div#container
{
  position:relative; 
  width: 760px;
  margin: 0 auto;
  text-align: left;
  border: 2px solid gray;
}
/*sezioni della pagina */
div#header
{
  width:100%;
  height:70px;
  background:#FF3333;
}
div#menu_dx
{
  float:right;
  width:20%;
  background:#00CC00;
  min-height:400px;
}
* html div#menu_dx
{
  height:400px;
}
div#contenuti
{
  float:right;
  width:80%;
  background:#C29FFF;
  min-height:400px;
}
* html div#contenuti
{
  height:400px;
}
div#piede
{
  clear:both;
  width:100%;
  background:blue;
  height:20px;
}
/*stili per le sezioni*/

/* CONTENUTI */
div#contenuti h2
{
  color:red;
  text-align:center;
  background:purple;
  padding:0;
  margin:0;
}

risultato con firefox (con IE è simile!):

(quello in giallo è il mio commento)

Grazie a tutti coloro che avranno la pazienza di aiutarmi!

P.S.
i colori scelti servono solo per comprendere la struttura del sito, non saranno questi,io ho gusti decisamente migliori!

... il codice del form l'ho tolto perchè è ininfluente e allungava solo questo post!!

P.P.S
se uso il tag h1 non succede questo!

**maurelio79** · 06-09-2007, 15:00

Secondo me il problema sta nel fatto che nei css dichiari 2 volte h2:

codice:

h2
{
  margin-top:0;
  padding-top:0;
  text-align:center;
  font-size: 1.6em;
  font-family:"Verdana";
}

div#contenuti h2
{
  color:red;
  text-align:center;
  background:purple;
  padding:0;
  margin:0;
}

Prova togliendo una delle due dichiarazioni

**Whitecrowsrain** · 06-09-2007, 15:39

Originariamente inviato da maurelio79
Secondo me il problema sta nel fatto che nei css dichiari 2 volte h2:

codice:

h2
{
  margin-top:0;
  padding-top:0;
  text-align:center;
  font-size: 1.6em;
  font-family:"Verdana";
}

div#contenuti h2
{
  color:red;
  text-align:center;
  background:purple;
  padding:0;
  margin:0;
}

Prova togliendo una delle due dichiarazioni

la seconda l'ho messa proprio perchè dava questo problema!
e cmq si possono ridefinire gli stessi elemeni per div diversi!!!!

qualche altra idea?

**Whitecrowsrain** · 07-09-2007, 09:11

nessuno ha un suggerimento da darmi?
allora vi do un altro indizio, la riga al di sopra dell'h2 è alta quanto quella dell'h2 stesso..infatti se io ingrandisco la grandezza della linea di quest'ultimo si ingrandisce anche la linea al di sopra..

nessuno sa come aiutarmi?

PLEASE!

Discussione: <h2> scrive una riga in più!

Strumenti discussione

Ricerca discussione

Visualizza

<h2> scrive una riga in più!

il mistero della riga in più

Permessi di invio