Problema MENU' A TENDINA

**Bacucco** · 28-05-2011, 02:47

Ho editato un menù a tendina che ho trovato su internet ma, dopo averlo adeguatamente adattato per renderlo visualizzabile nel sito, questo si vede male! (SOPRATTUTTO CON IE -.-)

Il risultato è quello nell'immagine! E, come ho già dettp, in IE è un casino! >.< Non capisco perché...ma sono sicuro che l'errore sia in uno dei 2 file .css

Mi potete dare una mano?? >.< Ve ne sarei infinitamente grato...! =)

Vi posto i codici:

index.htm

codice:

<html>

<head>
<link rel="stylesheet" href="style.css"/>


<link href="css/dropdown.css" media="screen" rel="stylesheet" type="text/css" />
<link href="css/default.advanced.css" media="screen" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.dropdown.js"></script>


</head>

<body topmargin="0" rightmargin="0" leftmargin="0" bottommargin="0">
<table align="center" id="testata" cellspacing="0" cellpadding="0">
	<tr>
		<td width="100%" background="imgs/main/menu_bg.png" align="center">
			
			<table align="center" id="main" cellspacing="0" cellpadding="0">
				<tr>
					<td>
						<input id="bottone" type="button" value="Museo">
					</td>
					<td>
						<input id="bottone" type="button" value="Eventi">
					</td>
					<td>
						<ul id="nav" class="dropdown dropdown-horizontal">
							<li class="dir">
							<input id="bottone" type="button" value="Notizie" class="dir">
								<ul>
									<li class="first"><font id="menu">Ieri</font>
									<li class="last"><font id="menu">Oggi</font>
								[/list]
							
						[/list]
					</td>
					<td>
						<ul id="nav" class="dropdown dropdown-horizontal">
							<li class="dir">
							<input id="bottone" type="button" value="Multimedia" class="dir">
								<ul>
									<li class="first"><font id="menu">Archivio Foto</font>
									[*]<font id="menu">Archivio Video</font>
									<li class="last"><font id="menu">Archivio Doc.</font>
								[/list]
							
						[/list]
					</td>
					<td>
						<ul id="nav" class="dropdown dropdown-horizontal">
							<li class="dir">
							<input id="bottone" type="button" value="Società Sportive" class="dir">
								<ul>
									<li class="first"><font id="menu">Calcio</font>
										<ul>
											<li class="last"><font id="menu">Società</font>
												<ul>
													<li class="first"><font id="menu">Atleti</font>
													<li class="last"><font id="menu">Dirigenti</font>
												[/list]
											
										[/list]
									
									[*]<font id="menu">Basket</font>
									<li class="last"><font id="menu">Discipline</p>Marittime</font>
								[/list]
							
						[/list]
					</td>
					<td>
						<ul id="nav" class="dropdown dropdown-horizontal">
							<li class="dir">
							<input id="bottone" type="button" value="Sostenitori" class="dir">
								<ul>
									<li class="first"><font id="menu">Partners</font>
									<li class="last"><font id="menu">Patrocini</font>
								[/list]
							
						[/list]
					</td>
					<td>
						<input id="bottone" type="button" value="Contatti">
					</td>
					<td>
						<input id="bottone" type="button" value="Guide">
					</td>
				</tr>
			</table>
			
		</td>
	</tr>
</table>
</body>

</html>

css/default.advanced.css

codice:

@charset "UTF-8";

/** 
 * Default Advanced CSS Drop-Down Menu Theme
 *
 * @file		default.advanced.css
 * @name		Default
 * @version		beta
 * @type		transitional
 * @browsers	Windows: IE5+, Opera9+, Firefox1+
 *				Mac OS: Safari2+, Firefox2+
 *
 * @link		http://www.lwis.net/
 * @copyright	2008 Live Web Institute
 *
 */

@import "default.css";


/*-------------------------------------------------/
 * @section		Base Style Extension
 */

ul.dropdown li a {
 display: block;
 padding: 1px 0px;
}


/*-------------------------------------------------/
 * @section		Base Style Override
 */

ul.dropdown li, ul.dropdown ul li {
 padding:0;
}


/*-------------------------------------------------/
 * @section		Base Style Reinitiate: post-override activities
 */

ul.dropdown li.dir {
 padding: 0px 0px 0px 0px;
}

ul.dropdown ul li.dir {
 padding: 0px 0px;
}


/*-------------------------------------------------/
 * @section		Custom
 */

ul.dropdown ul a {
 padding: 1px;
}






ul.dropdown li.hover *.open {
 color: #b0d730;
}

/* CSS2 clone */

ul.dropdown li:hover > *.dir {
 color: #b0d730;
}

css/default.css

codice:

@charset "UTF-8";

/** 
 * Vimeo.com CSS Drop-Down Menu Theme
 *
 * @file		default.css
 * @name		Vimeo
 * @version		beta
 * @type		transitional
 * @browsers	Windows: IE5+, Opera9+, Firefox1+
 *				Mac OS: Safari2+, Firefox2+
 *
 * @link		http://www.lwis.net/
 * @copyright	2009 Live Web Institute. All Rights Reserved.
 *
 */


/*-------------------------------------------------/
 * @section		Base Drop-Down Styling
 */


ul.dropdown {
 background: transparent url(images/box1-bottom-left.png) 0 100% no-repeat;
 font: normal 0px/normal Arial;
}

	ul.dropdown li {
	 padding: 5px 5px;
	 background-color: #0f0f0f;
	 color: #fff;
	 line-height: 5px;
	 white-space: nowrap;
	}

	ul.dropdown li.first {
	 padding-left: 5px;
	 background: transparent url(images/box1-bottom2.png) 0 100% no-repeat;
	}

	ul.dropdown li.last {
	 padding-right: 5px;
	 background: transparent url(images/box1-bottom2.png) 100% 100% no-repeat;
	}

	ul.dropdown li.hover,
	ul.dropdown li:hover {
	 color: #b0d730;
	}

	ul.dropdown a:link,
	ul.dropdown a:visited	{ color: #fff; text-decoration: none; }
	ul.dropdown a:hover		{ color: #b0d730; }
	ul.dropdown a:active	{ color: #0395cc; }


	/* -- level mark -- */

	ul.dropdown ul {
	 width: 115px;
	 padding: 1px;
	 background: url(images/box1-top.png) 50% 0 no-repeat;
	}

	ul.dropdown li.last ul {
	 left: 5px;
	 right: 16px;
	}

		ul.dropdown ul li {
		 height: auto;
		 padding: 5px 5px;
		 line-height: 1.3em;
		 white-space: normal;
		}

		ul.dropdown ul li.first {
		 padding-left: 0px;
		 background: #0f0f0f;
		}

		ul.dropdown ul li.last {
		 padding-bottom: 5px;
		 background: transparent url(images/box1-bottom.png) 50% 100% no-repeat;
		}

		ul.dropdown ul li.first ul {
		 top: 0;
		 padding: 0px 0px 0 115px;
		}

		ul.dropdown ul li.first li.first {
		 background-image: none;
		}

		ul.dropdown ul li.last {
		 padding-right: 0;
		}

		ul.dropdown ul li.last ul {
		 left: auto;
		 right: auto;
		 top: 0px;
		}

		/* -- level mark -- */

		ul.dropdown ul ul {
		 top: 0px;
		 left: auto;
		 padding: 16px 0 0;
		 background: transparent url(images/box1-top-left.png) 0 0 no-repeat;
		}

			ul.dropdown ul ul li.first {
			 padding-top: 0px;
			 background: #0f0f0f url(images/box1-top-right.png) 100% 0 no-repeat;
			}


/*-------------------------------------------------/
 * @section		Search Form
 */

ul.dropdown form * {
 display: inline;
 float: center;
}

ul.dropdown form label {
 display: none;
}

ul.dropdown form input.text {
 width: 143px;
 height: 18px;
 padding: 0px 0px 0px 0px;
 border-width: 0;
 background: transparent url(images/bg_search-field.png) 0 0 no-repeat;
 color: #969696;
 font: normal 14px/17px Tahoma, Verdana, Arial, Helvetica, sans-serif;
 vertical-align: middle;
 horizontal-align: center;
}

ul.dropdown form input.text:focus {
 outline: none;
}

ul.dropdown form input.button {
 position: relative;
 margin: 4px 0 0 -20px;
}


/*-------------------------------------------------/
 * @section		Support Class `dir`
 */


ul.dropdown *.dir {
 padding-right: 0px;
}


/* -- Components override -- */

ul.dropdown-horizontal ul *.dir {
 padding-right: 15px;
 background-image: url(images/nav-arrow-right.png);
 background-position: 95% 50%;
 background-repeat: no-repeat;
}

GLI SCRIPT NON LI HO EDITATI, QUINDI NON LI STO NEPPURE A POSTARE. SE VI SERVONO LI POSTO IN SEGUITO...

GRAZIE IN ANTICIPO RAGAZZI... =)

PS: Il file style.css l'ho creato io, non c'entra nulla con lo script...

Discussione: Problema MENU' A TENDINA

Strumenti discussione

Ricerca discussione

Visualizza

Hybrid View

Problema MENU' A TENDINA

Permessi di invio