Come sempre.. Explorer si.. Firefox proprio no.

**ChemicalMe** · 15-01-2010, 02:55

Salve ragazzi, getto la spugna e chiedo aiuto.
Non riesco a capire come sistemare il problema con firefox:
lo sfondo dei pulsanti proprio non vuole allinearsi dove dovrebbe, invece di stare dentro al div che lo dovrebbe contenere, è metà al di sopra e metà dentro.

La struttura è questa:
C'è un'immagine di base come sfondo della barra dei pulsanti (con contorni arrotondati eccetera), sopra appaiono dei pulsanti composti da semplice testo, ed il loro sfondo cambia (di immagine) al passaggio del mouse.

Ed ecco il codice..

css:

a.pulsante:link {
BACKGROUND: url(sfondopulsanteoff.png);
BACKGROUND-POSITION: center;
background-repeat: repeat-x;
height: 68px;
min-height: 68px;
color: #000393;
padding-left: 20px;
padding-right: 20px;
padding-top: 25px;
text-decoration: none;
}
a.pulsante:hover {
BACKGROUND: url(sfondopulsanteon.png);
BACKGROUND-POSITION: center;
background-repeat: repeat;
height: 68px;
min-height: 68px;
color: #ffffff;
padding-left: 20px;
padding-right: 20px;
padding-top: 25px;
text-decoration: none;
}
#barrapulsanti {
BACKGROUND: url(barrapulsanti.png);
background-repeat: no-repeat;
height: 68px;
width: 800;
}

in body:

<center><div id="barrapulsanti">
<font face="Arial" size="4">Testo Testo Testo Testo
</font>
</div>

Potete aiutarmi?
Grazie in anticipo

**miki003** · 15-01-2010, 04:20

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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento senza titolo</title>
<style type="text/css" media="screen">
#barrapulsanti {
	clear: both;
	width: 800px;
	height: 68px;
	background: #00F;
	margin: 0 auto;
}
ul {
	list-style: none;
	width: 500px;
	margin: 0 auto;
}
ul li {
	background: #F00;
	color: #FFF;
	width: 120px;
	height: 68px;
	float: left;
	margin: 0 5px 0 0;
}
ul li a {
	display: block;
	text-decoration: none;
	height: 68px;
}
ul li a:hover {
	display: block;
	background: #FF0;
	color: #F00;
	text-decoration: none;
}
</style>
</head>

<body>
<div id="barrapulsanti">
<ul>[*]Testo[*]Testo[*]Testo[*]Testo[/list]
<div style="clear:both"></div>
</div>
</body>
</html>

Cambia lo sfondo e il clore del testo come vuoi tu

**ChemicalMe** · 15-01-2010, 17:22

Ti ringrazio moltissimo per il tuo aiuto

Ho però ancora un problema con il posizionamento del testo, che non riesco a spostare verso il basso (o meglio se provo a spostare il testo va giù con tutto lo sfondo)

Inoltre ho qualche perplessità riguardo il float e il display: block, che solitamente portano solo guai. Infatti non vorrei dare una width predefinita, in maniera da poter aggiungere altri pulsanti se necessario, senza dover riadattare anche il css.

**fcaldera** · 15-01-2010, 18:50

la prossima volta, prima di aprire un thread leggi attentamente il regolamento in evidenza, soprattutto riguardo ai titoli, grazie.

Discussione: Come sempre.. Explorer si.. Firefox proprio no.

Strumenti discussione

Ricerca discussione

Visualizza

Come sempre.. Explorer si.. Firefox proprio no.

Permessi di invio