| ||||
| Problema con la posición del menú Hola a todos, tengo un menú HTML y CSS. Este menú lo inserto en el Div Cabecera, pero tengo un problema, ese menú no se queda en la posición de la cabecera, es mas, es como si no tubiese ningún Div, miren, este es el codigo HTML de mi web: Código HTML: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <link rel="StyleSheet" href="style.css" type=text/css> <title>index</title> <meta name="author" content="Distriker" > <meta name="generator" content="screem 0.16.1" > <meta name="description" content="" > <meta name="keywords" content="" > <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" > <meta http-equiv="Content-Script-Type" content="text/javascript" > <meta http-equiv="Content-Style-Type" content="text/css" > </head> <body> <div id="contenido"> <div id="cabecera"> <h1>Bienvenido a Betaconsolas.com</h1> <h2>:D:D:D</h2> </div> <div id="sidebar-izquierda"> <h3>Sección</h3> <p>Bla bla ...</p> </div> <div id="centro"> <h3>Vacio</h3> <p>Vacio</p> <p>dsd</p> <p>dsa</p> <p>asas</p> </div> <div id="sidebar-derecha"> <h3>Seccion 2</h3> <p>Bla bla ....</p> </div> <div id="footer"> Pie - Datos aquí </div> </div> </body> </html>
Código css:
Ver originalCopiar ¿Qué le pasa? No entiendo el problema. aunque cambie de Div, siempre está ahí, en la misma posición incorrecta :.Miren una imagen: ![]() El menú es lo que pone DropLine, DropDown, Flyout y todo eso de ahí, es decir, lo de negro. Espero que me puedan ayudar. Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| |||
| Respuesta: Problema con la posición del menú #dropline {position:relative;background:#f00;left:100px;top: 100px;} despues para posicionarlo donde quieres vas jugando con los valores de left y top. Y si puedes muestra una imagen con el menu desplegado. |
| ||||
| Respuesta: Problema con la posición del menú Ok, muchas gracias Eseceve, ya te diré como me ha quedado y si tengo mas problemas. Ahora me tengo que ir, así que ya te contaré las cosas mas tarde. Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú Hola de nuevo: Prueba con esto a ver si te sirve, logicamente tendrás que adaptarlo a tus necesidades:
Código:
Saludos.
<div id="contenido">
<div id="cabecera">
<h1>Bienvenido a Betaconsolas.com</h1>
<h2>:D:D:D</h2>
<ul id="dropline">
<li><a href="#">Dropdown</a></li>
<li><a href="#">Dropline</a></li>
<li><a href="#">Flyout</a></li>
<li><a href="#">Support</a></li>
</ul>
</div>
|
| ||||
| Respuesta: Problema con la posición del menú Si escogo ese codigo si se queda en la cabecera, pienso que lo modificaré. Muchas gracias Jomaruro, ya os contaré como me fue y todo eso. Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú Hola de nuevo, he echo lo que ha dicho Eseceve y he jugado con los valores y me ha dado, creo, un buen resultado, así ha quedado el codigo:
Código html:
Ver originalCopiar Así ha quedado el CSS:
Código css:
Ver originalCopiar Y así quedo en una imagen: ![]() ¿Qué os parece? Ahora lo que intento es que se alineen a la derecha, que pienso que con un poco de investigación en el codigo, me las puedo arreglar. Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú Bueno, tengo mas problemas con la posición del menú. Estoy intentado colocar el menu en lo mas alto de la cabecera, pero cuando coloco el codigo me sale así: ![]() Cuando debería de salir así, sino que en vez de tener el menú al final de la cabecera, lo tendría arriba, pero no, sale mal. El codigo HTML es este: Código HTML: <div id="contenido"> <div id="cabecera"> <ul id="dropline"> <li><a class="sub" href="dropdown.html"><b>Dropdown</b><!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <div> <ul> <li><a href="#url">Dropdown One</a></li> <li><a href="#url">Dropdown Two</a></li> <li><a href="#url">Dropdown Three</a></li> <li><a href="#url">Dropdown Four</a></li> <li><a class="last" href="#url">Dropdown Five</a></li> </ul> </div> <li><a class="sub" href="#"><b>URL</b><!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <div> <ul> <li><a href="#url">URL One</a></li> <li><a href="#url">URL Two</a></li> <li><a href="#url">URL Three</a></li> <li><a href="#url">URL Four</a></li> <li><a class="last" href="#url">URL Five</a></li> </ul> </div> <h1>Bienvenido a Betaconsolas.com</h1> <h2>:D:D:D</h2> </div> ¿Qué puede haberle pasado? Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú Con tu código no puedo ver nada que se parezca remotamente a tu imagen. ¿Puedes subirlo a algún sitio para verlo, y de paso poner dónde quieres exactamente que quede el menú superior?
__________________ No esperes que nadie haga más esfuerzo en responderte que el que hagas tú en preguntar. |
| ||||
| Respuesta: Problema con la posición del menú Hola Mik, esta es la web cuando situo el menu en la parte inferior de la cabecera: Probando 1 El HTML: Código HTML: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <link rel="StyleSheet" href="style.css" type=text/css> <title>index</title> <meta name="author" content="Distriker" > <meta name="generator" content="screem 0.16.1" > <meta name="description" content="" > <meta name="keywords" content="" > <meta http-equiv="content-type" content="text/html; charset=UTF-8" > <meta http-equiv="Content-Script-Type" content="text/javascript" > <meta http-equiv="Content-Style-Type" content="text/css" > </head> <body> <div id="contenido"> <div id="cabecera"> <h1>Bienvenido a Betaconsolas.com</h1> <h2>:D:D:D</h2> <ul id="dropline"> <li><a class="sub" href="dropdown.html"><b>Dropdown</b><!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <div> <ul> <li><a href="#url">Dropdown One</a></li> <li><a href="#url">Dropdown Two</a></li> <li><a href="#url">Dropdown Three</a></li> <li><a href="#url">Dropdown Four</a></li> <li><a class="last" href="#url">Dropdown Five</a></li> </ul> </div> <li><a class="sub" href="#"><b>URL</b><!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <div> <ul> <li><a href="#url">URL One</a></li> <li><a href="#url">URL Two</a></li> <li><a href="#url">URL Three</a></li> <li><a href="#url">URL Four</a></li> <li><a class="last" href="#url">URL Five</a></li> </ul> </div> </div> <div class="borde-inferior" <div id="sidebar-izquierda"> <h3>Sección</h3> <p>Bla bla ...</p> </div> <div id="centro"> <h3>Vacio</h3> <p>Vacio</p> <p>dsd</p> <p>dsa</p> <p>asas</p> </div> <div id="sidebar-derecha"> <h3>Seccion 2</h3> <p>Bla bla ....</p> </div> <div id="footer"> Pie - Datos aquí </div> </div> </body> </html>
Código CSS:
Ver originalCopiar Ahora, si situo el menú en la parte superior, pasa esto: Probando 2. (¿Veis? Se va para abajo lo que se supone que debe de estar en el div :.El HTML es este: Código HTML: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <link rel="StyleSheet" href="style.css" type=text/css> <title>index</title> <meta name="author" content="Distriker" > <meta name="generator" content="screem 0.16.1" > <meta name="description" content="" > <meta name="keywords" content="" > <meta http-equiv="content-type" content="text/html; charset=UTF-8" > <meta http-equiv="Content-Script-Type" content="text/javascript" > <meta http-equiv="Content-Style-Type" content="text/css" > </head> <body> <div id="contenido"> <div id="cabecera"> <ul id="dropline"> <li><a class="sub" href="dropdown.html"><b>Dropdown</b><!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <div> <ul> <li><a href="#url">Dropdown One</a></li> <li><a href="#url">Dropdown Two</a></li> <li><a href="#url">Dropdown Three</a></li> <li><a href="#url">Dropdown Four</a></li> <li><a class="last" href="#url">Dropdown Five</a></li> </ul> </div> <li><a class="sub" href="#"><b>URL</b><!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <div> <ul> <li><a href="#url">URL One</a></li> <li><a href="#url">URL Two</a></li> <li><a href="#url">URL Three</a></li> <li><a href="#url">URL Four</a></li> <li><a class="last" href="#url">URL Five</a></li> </ul> </div> <h1>Bienvenido a Betaconsolas.com</h1> <h2>:D:D:D</h2> </div> <div id="sidebar-izquierda"> <h3>Sección</h3> <p>Bla bla ...</p> </div> <div id="centro"> <h3>Vacio</h3> <p>Vacio</p> <p>dsd</p> <p>dsa</p> <p>asas</p> </div> <div id="sidebar-derecha"> <h3>Seccion 2</h3> <p>Bla bla ....</p> </div> <div id="footer"> Pie - Datos aquí </div> </div> </body> </html> Y si el menú lo pongo arriba y abajo como quiero llegar a hacer, me sale mas horrendo aun :, miren:http://betaconsolas.com/probando/index3.html El HTML os lo podeis descargar de aquí, ya que en este mensaje no me cambian mas caracteres ![]() Y el CSS es el mismito. ¿Qué le pasa a mi codigo? Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú Perdona, pero me gustaría que si no es para ayudar, no contestes ni nada. El Wordpress ya se usará en el blog .Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú Perdoname pero lo que yo no alcanzo a comprender es cómo quieres que se vea: - ¿el título "Bienvenido a Betaconsolas.com" debe estar en la zona verde? - ¿centrado? - ¿los dos elementos del menú arriba a la izquierda? - ¿dónde debe aparecer la parte desplegable? De verdad, no imagino cómo lo quieres hacer. Tienes además todo el conjunto con una anchura de 800px pero con un margen a izquierda y derecha de 300px, por lo que en 1024 sale un enorme scroll horizontal del todo innecesario.
__________________ No esperes que nadie haga más esfuerzo en responderte que el que hagas tú en preguntar. |
| ||||
| Respuesta: Problema con la posición del menú Veamos:
![]() De todas formas, tenía pensado poner un menú abajo donde la gente pueda elegir la resolución perfecta para su web, había elejido un menú para ello ya, mira, el primero o el segundo. ¿Mas claro todo? Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú El de cristalab está hecho con javascript (cualquier comportamiento en línea temporal no se puede reproducir con CSS). Si quieres hacerlo sólo con CSS, mira este ejemplo a ver si te da una idea de cómo lo hago yo. Y si no ya mirar con javascript.
__________________ No esperes que nadie haga más esfuerzo en responderte que el que hagas tú en preguntar. |
| ||||
| Respuesta: Problema con la posición del menú En tu código, busca este selector y ponlo así: Cita: Eso de momento en FF hará que el menú desplegable salga junto al principal, de todas maneras sigo sin tener claro cómo lo quieres hacer. #dropline *:hover div { left:-280px; top:20px; }
__________________ No esperes que nadie haga más esfuerzo en responderte que el que hagas tú en preguntar. |
| ||||
| Respuesta: Problema con la posición del menú Cita: Me encanta ese menú echo por ti, es sencillo, y muy bonito. Veré el codigo.
Iniciado por Mikmoro El de cristalab está hecho con javascript (cualquier comportamiento en línea temporal no se puede reproducir con CSS). Si quieres hacerlo sólo con CSS, mira este ejemplo a ver si te da una idea de cómo lo hago yo. Y si no ya mirar con javascript. Cita: Creo que mejor me voy a concentrar en tu menú, me concentraré en el, perdonad el que os esté volviendo loco con tanto menú , pero es que tengo muchos nervios por hacer la web bien. Bueno, ya os contaré como me va con el menú este. Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú Hola Mik, he echo lo que te dije, apliqué el menú de ejemplo tuyo, pero tengo un problemilla (no paro de tener problemas ). La opción 5 se va para abajo, mira en la web, lo he intentado corregir corrigiendo la posición pero no me sale ![]() El codigo HTML es exactamente el de tu menú, aquí te dejo el DIV de la cabecera con el del menú dentro: Código HTML: <div id="cabecera"> <div id="menu"> <ul> <li class="nivel1"><a href="http://www.forosdelweb.com" class="nivel1">Opción 1</a> <!--[if lte IE 6]><a href="http://www.forosdelweb.com" class="nivel1ie">Opción 1<table class="falsa"><tr><td><![endif]--> <ul class="uno"> <li><a href="#">Opción 1.1</a></li> <li><a href="#">Opción 1.2</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li class="nivel1"><a href="#" class="nivel1">Opción 2</a> <!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 2<table class="falsa"><tr><td><![endif]--> <ul class="dos"> <li><a href="#">Opción 2.1</a></li> <li><a href="http://www.google.es">Opción 2.2</a></li> <li><a href="#">Opción 2.3</a></li> <li><a href="#">Opción 2.4</a></li> <li><a href="#">Opción 2.5</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li class="nivel1"><a href="#" class="nivel1">Opción 3</a> <!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 3<table class="falsa"><tr><td><![endif]--> <ul class="tres"> <li><a href="#"></a></li> <li><a href="#">Opción 3.1</a></li> <li><a href="#">Opción 3.2</a></li> <li><a href="#">Opción 3.3</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li class="nivel1"><a href="#" class="nivel1">Opción 4</a> <!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 4<table class="falsa"><tr><td><![endif]--> <ul class="cuatro"> <li><a href="#"></a></li> <li><a href="#">Opción 4.1</a></li> <li><a href="#">Opción 4.2</a></li> <li><a href="#">Opción 4.3</a></li> <li><a href="#">Opción 4.4</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li class="nivel1"><a href="#" class="nivel1">Opción 4</a> <!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 4<table class="falsa"><tr><td><![endif]--> <ul class="cinco"> <li><a href="#"></a></li> <li><a href="#">Opción 4.1</a></li> <li><a href="#">Opción 4.2</a></li> <li><a href="#">Opción 4.3</a></li> <li><a href="#">Opción 4.4</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> </div> <h1>Bienvenido a Betaconsolas.com</h1> <h2>:D:D:D</h2> </div>
Código CSS:
Ver originalCopiar ¿Qué tendría que modificarle para que el menú se quede acoplado correctamente? Por cierto, me podrías explicar para que sirve ese atributo table.falsa, se que es para la etiqueta <table class="falsa">, ¿pero para que sirve esa etiqueta? Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú Hola: Da la impresión de que los botones del menú no caben dentro del div que los contiene <div id="menu">. Prueba a hacerlo un poco más ancho o reducir un poco los botones. De todas formas, por lo menos en el código HTML en el foro, te falta cerrar el <ul> del principio del menu. Saludos. |
| ||||
| Respuesta: Problema con la posición del menú Sí, una solución sería reducir los LI: #menu ul li.nivel1 {float:left; margin-right:2px; position:relative; width:150px; } Recuerda también reducir los ul del segundo nivel. La tabla falsa es para que IE6 permita utilizar los vínculos del desplegable, porque como todo está en un enlace (cada lista de segundo nivel de enlaces), si estuvieran directamente ahí sin más no permitiría meter otros enlaces, pero estando estos dentro de una tabla cada lista de segundo nivel se desvincula del enlace principal que le corresponde. La clase falsa es por si tienes otras tablas en tu HTML, para que la CSS no afecte a todas.
__________________ No esperes que nadie haga más esfuerzo en responderte que el que hagas tú en preguntar. |
| ||||
| Respuesta: Problema con la posición del menú Cita: Vale, el menú se ha colocado correctamente
Iniciado por Mikmoro Sí, una solución sería reducir los LI:
Código:
Recuerda también reducir los ul del segundo nivel.#menu ul li.nivel1 {float:left;
margin-right:2px;
position:relative;
width:150px;
}
La tabla falsa es para que IE6 permita utilizar los vínculos del desplegable, porque como todo está en un enlace (cada lista de segundo nivel de enlaces), si estuvieran directamente ahí sin más no permitiría meter otros enlaces, pero estando estos dentro de una tabla cada lista de segundo nivel se desvincula del enlace principal que le corresponde. La clase falsa es por si tienes otras tablas en tu HTML, para que la CSS no afecte a todas. , pero cuando se despliega, el despliege es muy grande, y el problema es que se ve feo, feo, seguramente sea el ul de nivel 2, pero no está en el CSS.¿Ahora? ¿Qué pasa? Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú ¿Cómo no va a estar en la CSS?: Cita: #menu ul li a:hover ul, #menu ul li:hover ul {display: block; position: absolute;width: 816px;border: solid 1px #fff;border-top: none;background-color: #6CC; }
__________________ No esperes que nadie haga más esfuerzo en responderte que el que hagas tú en preguntar. |
| ||||
| Respuesta: Problema con la posición del menú ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() No me lo puedo creer, estoy mal, ultimamente estoy mal, muy mal, que me pasa .Bueno, muchas gracias Mik, cuando termine los deberes lo pobraré .Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú Eso es que en tu tierra ya empieza a pegar el sol, viene el calorcito...
__________________ No esperes que nadie haga más esfuerzo en responderte que el que hagas tú en preguntar. |
| ||||
| Respuesta: Problema con la posición del menú Sí, sí, lo sabía, y sabía que casi todo el año hace solito, pero ahora ya empezará a apretar, ¿no?
__________________ No esperes que nadie haga más esfuerzo en responderte que el que hagas tú en preguntar. |
| ||||
| Respuesta: Problema con la posición del menú Hola Mik, de nuevo estoy aquí, me he escaqueado un poquito, mira, esto es lo que he modificado:
Código:
Así aparece.#menu ul li a:hover ul, #menu ul li:hover ul {display: block;
position: absolute;width: 715px;border: solid 1px #fff;border-top: none;background-color: #6CC;
}
¿Qué tiene mal? ¿La posición del menú? Respondiendo a lo del sol: Aquí si suele hacer sol todo el año aunque hoy mismo estamos en tormenta , pero, nosotros vamos a la playa hasta con el día nublado y cogemos olas (al menos yo y mi familia), yo me meto en el agua hasta lloviendo, yo amo el mar , el surf es mi pasión .Saludos
__________________ Si no te quejas, nunca conseguiras nada, pero si te quejas siempre lo perderás todo. Una mala acción da fruto a un mal Karma. |
| ||||
| Respuesta: Problema con la posición del menú Mira, en esta parte de la CSS, al haber reducido el tamaño tienes que ir reduciendo esos números hasta que cada submenú quede en su sitio exacto: Cita: P.D.: Conozco algo tu pueblo (en realidad Tenerife y Lanzarote). Para quien es ciego al mar como tú, una de las mejores zonas del mundo para vivir, ¿no? ul.uno {left: -0px;} ul.dos {left: -164px;} ul.tres {left: -328px;} ul.cuatro {left: -492px;} ul.cinco {left: -656px;}
__________________ No esperes que nadie haga más esfuerzo en responderte que el que hagas tú en preguntar. |