Hola que tal, consegui el codigo de un menu desplegable, el cual muestra submenus de manera horizontal, el problema es que la posicion en la que aparece siempre es hasta el lado izquierdo de la pagina, la cual no puedo, mas bien no se como modificar, intente cambiando margin:auto, left:0, pero no lo logre, alguien sabe que campos debo modificar para poder posicionar el menu en cualquier parte de la pagina? Este es el codigo:
<span class=codigo>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><br />
<head><br />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /><br />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><br />
<title> Men? flyout</title><br />
<br />
<br />
<br />
<style type="text/css"><br />
/* ================================================================ <br />
This copyright notice must be kept untouched in the stylesheet at <br />
all times.<br />
<br />
The original version of this stylesheet and the associated (x)html<br />
is available at http://www.cssplay.co.uk/menus/anywidth-flyout.html<br />
Copyright (c) 2005-2009 Stu Nicholls. All rights reserved.<br />
This stylesheet and the associated (x)html may be modified in any <br />
way to fit your requirements.<br />
=================================================================== */<br />
<br />
#menu { margin:0; }<br />
<br />
#menu ul {margin:0; padding:0; list-style:none; text-align:left; padding:0;border-bottom:1px solid #6284FB; background:#FFFFCC}<br />
#menu ul ul{background: #B3C4FD;white-space:nowrap;}<br />
#menu ul ul ul{background: #FFF;white-space:nowrap;}<br />
<br />
#menu li {margin:0; padding:4px 0; list-style:none;}<br />
#menu li {display:inline-block; display:inline;}<br />
#menu ul {position:absolute; left:-9999px;}<br />
#menu ul.level1 {position:absolute; left:0; width: 150px; line-height: 11px;}<br />
<br />
#menu a {display:block; font: normal 11px/12px "Trebuchet MS",arial,sans-serif; color:#000; text-decoration:none;padding:4px 20px 4px 10px; border-left:1px solid #6284FB;border-right:1px solid #6284FB;border-top:1px solid #6284FB;} <br />
<br />
#menu ul li:hover > ul {visibility:visible; left:100%; margin-top:-21px; margin-left:-1px;}<br />
<br />
#menu a:hover ul,<br />
#menu a:hover a:hover ul, <br />
#menu a:hover a:hover a:hover ul {left:100%; visibility:visible;}<br />
#menu a:hover ul ul, <br />
#menu a:hover a:hover ul ul {left:-9999px;}<br />
<br />
#menu li a:hover {background:#CFD9FE;} <br />
#menu li:hover > a {background: #CFD9FE;}<br />
#menu li a.fly {background: url(flecha.gif) no-repeat right top;}<br />
#menu li a.fly:hover {background:#CFD9FE url(flecha.gif) no-repeat right top;} <br />
#menu li:hover > a.fly {background:#CFD9FE url(flecha.gif) no-repeat right top;}<br />
<br />
#menu table {position:absolute; left:99%; height:0; width:0; border-collapse:collapse; margin-top:0px; margin-left:-2px;}<br />
<br />
<br />
</style><br />
<br />
</head><br />
<br />
<br />
<body>
</span>
... Pertenece a la categoría:
| |