Ver Mensaje Individual
  #1 (permalink)  
Antiguo 23/05/2010, 21:07
sagaas
 
Fecha de Ingreso: mayo-2010
Mensajes: 1
Antigüedad: 13 años, 11 meses
Puntos: 0
Se dimenciona la pag.

Que tal estoy tratando de implementar este menu, el problema que al pasar el raton aparecen las barras de desplazamiento hori y vert. modificando el tamaño de la web a ver que opinan. Gracias.

Código:
 HTML


			<div id="positioner">
	<div class="holder p1">
		<dl class="menu">
			<dt><a href="#url">Home</a></dt>
		</dl>
	</div>
	<div class="holder p2">
		<dl class="menu">
			<dt><a class="sub" href="#url">Products</a></dt>
			<dd class="dd4">
				<a href="#url">Digital Cameras</a>
				<a href="#url">Tripods</a>
				<a href="#url">Flashguns</a>
				<a href="#url">Telephoto Lenses</a>
			</dd>
		</dl>
	</div>
	<div class="holder p3">
		<dl class="menu">
			<dt><a class="sub" href="#url">Services</a></dt>
			<dd class="dd5">
				<a href="#url">Enlarging</a>
				<a href="#url">Framing</a>
				<a href="#url">Printing</a>
				<a href="#url">Copying</a>
				<a href="#url">Sepia Toning</a>
			</dd>
		</dl>
	</div>
	<div class="holder p4">
		<dl class="menu">
			<dt><a class="sub" href="#url">Outlets</a></dt>
			<dd class="dd4">
				<a href="#url">London</a>
				<a href="#url">Gloucestershire</a>
				<a href="#url">East Midlands</a>
				<a href="#url">Glasgow</a>
			</dd>
		</dl>
	</div>
	<div class="holder p5">
		<dl class="menu">
			<dt><a class="sub" href="#url">Terms</a></dt>
			<dd class="dd3">
				<a href="#url">Payment Methods</a>
				<a href="#url">Conditions of Sale</a>
				<a href="#url">Privacy Policy</a>
			</dd>
		</dl>
	</div>
	<div class="holder p6">
		<dl class="menu">
			<dt><a href="#url">Site Map</a></dt>
		</dl>
	</div>
</div>
Código:
 CSS

a, a:visited, a:hover, a:active, a:focus {direction:ltr; outline:0;}

#positioner {
			position:absolute; 
			width:750px; 
			height:25px; 
			background:#fff; /* color amarillo */
			top: 569px;
			margin-left: 250px;
			} 
.holder {
			position:absolute; 
			width:125px; 
			height:25px; 
			top: 0px;   /* superior*/
		}
dl.menu {
			width:250px; 
			float:left;
			margin:-32000px 0 0 -9999px;
		}
.p1 {left:0;}
.p2 {left:125px;}
.p3 {left:250px;}
.p4 {left:375px;}
.p5 {left:500px;}
.p6 {left:625px;}
dl.menu a {display:block; height:25px; font:normal 11px/25px verdana, sans-serif; text-decoration:none; text-indent:10px; border-bottom:1px solid #fff; border-left:1px solid #fff;}

 dl.menu dt {float:left; padding:0; position:relative; left:9999px; z-index:50; margin:32000px 0 0 0;}
 dl.menu dt a {width:124px; background:#aaa; float:left; color:#fff;}
 dl.menu dt a.sub {background:#888 url(dl-pullup/arrow.gif) no-repeat 110px center; color:#fff;}
 dl.menu dt a:hover,
 dl.menu dt a:focus,
 dl.menu dt a:active
 {margin-right:1px; text-decoration:none; background-color:#888; color:#fc0;}

 dl.menu dd {float:left; padding:0; margin:0;}
 dl.menu dd.dd3 {height:104px;}
 dl.menu dd.dd4 {height:130px;}
 dl.menu dd.dd5 {height:156px;}

 dl.menu dd:hover {clear:both;}
 dl.menu dd a {position:relative; height:25px; background:#aaa; width:124px; color:#fff; left:9999px; top:-100%; z-index:60;}
 dl.menu dd a:hover,
 dl.menu dd a:focus,
 dl.menu dd a:active
 {margin-right:1px; background:#888; color:#fc0;}