Dreamweaver - Barra menu spray centrada

   
Vista:

Barra menu spray centrada

Publicado por Alex (1 intervención) el 29/12/2014 13:43:06
Hola a tod@s,

En primer lugar, gracias a los administradores y usuarios de la web. Aunque no había planteado ningún tema hasta ahora, sí la he consultado en varias ocasiones y me han salvado de más de un apuro jejeje.

Bueno, la verdad es que soy un poco novato en lo de la creación de webs. Soy autodidacta, y de ahí que de vez en cuando me quede atascado con algún tema.

Es un caso extraño: estoy haciendo una web de diseño fluído (móvil, tablet, pc) y tengo un problema con la barra de menús spray horizontal que he insertado. Deseo que la barra quede centrada en la web independientemente del dispositivo que se esté usando para su visualización. Ahora mismo el menú me sale alineado a la izquierda.

Dentro de las "celdas" del menú, el texto está centrado, sin problema. Pero el menú en sí está alineado a la izquierda. En todas las webs que he consultado me dicen más o menos lo mismo. Que estipule un ancho al div en píxeles, con un margen. El problema es que, al ser una web que deberá poder verse en varios dispositivos, si estipulo un número X de píxeles, se carga mi diseño según con qué dispositivo se vea. Entiendo pues, que no puedo trabajar con píxeles sino con porcentajes.

Ahora mismo tengo el div con un ancho de 100% respecto a las columnas del diseño fluído (5, 8 y 10 columnas) y estoy más perdido que un ciego en un tiroteo. No encuentro la forma de hacer que el menú se vaya al centro de la página.

Gracias de antemano a quienes puedan echarme un cable.

Alex.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

Barra menu spray centrada

Publicado por xve (336 intervenciones) el 29/12/2014 21:24:03
Tienes publicada la web para que podamos verla, o nos puedes adjuntar los archivo para poder probarlo?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Barra menu spray centrada

Publicado por Alex (2 intervenciones) el 30/12/2014 12:27:16
Hola xve,

Todavía no tengo la página publicada, porque va a sustituir a otra y no la subiré hasta que quite la anterior. Sirve si pego el código aquí? Como no se qué es lo que necesitas mirar, te lo pego completo. Gracias! Es este:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<!doctype html>
<!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]-->
<!--[if IE 7]>    <html class="ie7 oldie"> <![endif]-->
<!--[if IE 8]>    <html class="ie8 oldie"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="">
<!--<![endif]-->
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bass & Treble - Producción musical LOW COST</title>
<link href="boilerplate.css" rel="stylesheet" type="text/css">
<script type='text/javascript' src='swfobject.js'></script>
<link href="estilofluido.css" rel="stylesheet" type="text/css">
<style type="text/css">
body {
	background-color: #000;
}
</style>
<link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
<!-- 
Para obtener más información sobre los comentarios condicionales situados alrededor de las etiquetas html en la parte superior del archivo:
paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
  
Haga lo siguiente si usa su compilación personalizada de modernizr (http://www.modernizr.com/):
* inserte el vínculo del código js aquí
* elimine el vínculo situado debajo para html5shiv
* añada la clase "no-js" a las etiquetas html en la parte superior
* también puede eliminar el vínculo con respond.min.js si ha incluido MQ Polyfill en su compilación de modernizr 
-->
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script src="respond.min.js"></script>
<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
</head>
<body>
<div class="gridContainer clearfix">
  <div id="encabezado"><img src="objetos/Nuevo logo Bass-Treble PNG NEGRO.png" alt="logo" longdesc="http://bass-treble.com"></div>
  <div id="banner2">
    <p>PRODUCCIÓN MUSICAL LOW COST</p>
    <p>GRABACIÓN-EDICIÓN-MEZCLA-MASTERIZACIÓN</p>
  </div>
  <div id="reproductor"><object type="application/x-shockwave-flash" data="reproductor/dewplayer-multi.swf" width="100%" height="20" id="dewplayer" name="dewplayer"> <param name="wmode" value="transparent" /><param name="movie" value="reproductor/dewplayer-multi.swf" /> <param name="flashvars" value="mp3=/objetos/mp3/Volta-Bite me.mp3|/objetos/mp3/Volta-Pull the trigger.mp3&amp;showtime=1&amp;randomplay=1" />
    <embed src="reproductor/dewplayer-multi.swf" width="100%" height="20" wmode="transparent" flashvars="mp3=/objetos/mp3/Volta-Bite me.mp3|/objetos/mp3/Volta-Pull the trigger.mp3&amp;showtime=1&amp;randomplay=1"></embed>
  </object>
  </div>
  <div id="menu">
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li>Quiénes somos</li>
      <li>Grabaciones
        <ul>
          <li><a href="#">Grabación por pistas</a></li>
          <li><a href="#">Grabación "en directo"</a></li>
          <li><a href="#">Grabación de conciertos</a></li>
        </ul>
      </li>
      <li>Artistas
        <ul>
          <li><a href="#">Volta</a></li>
          <li><a href="#">Alespaul</a></li>
          <li><a href="#">Elemento 3.3</a></li>
        </ul>
      </li>
      <li>Tarifas</li>
      <li>Extras</li>
      <li>Contacto</li>
    </ul>
  </div>
  <div id="contenido">Este es el contenido de la etiqueta Div de diseño "contenido"</div>
  <div id="pie">Este es el contenido de la etiqueta Div de diseño "pie"</div>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de xve

Barra menu spray centrada

Publicado por xve (336 intervenciones) el 30/12/2014 20:23:25
Hola Alex, el problema es que con la explicacion que nos das, no hay manera de poderte ayudar sin poder ver el codigo funcionando... como sabemos como has montado la pagina y los estilos para ayudarte?

Necesitarimos poder probar la pagina para poder ver el problema que nos comentas, y que estilos poner o quitar para poder solucionarlo.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Barra menu spray centrada

Publicado por Alex (2 intervenciones) el 31/12/2014 18:22:52
Hola xve,

Bueno, lo primero te agradezco las molestias. No tenía pensado publicar la página hasta que estuviesen solucionados los errores, pero ya puestos la he sustituído ya y la tienes aquí:

www.bass-treble.com

Como verás, está todo centradito y perfecto menos el menú. No entiendo porqué pero no hay forma de dejarlo en el centro sin estipular un padding en px. Y eso se carga mi diseño fluído.

gracias y feliz 2015 a tod@s los compis de la web!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar