Foros del Web » Creando para Internet » CSS »

Cambiar tamaño menu CSS desplaza todo

Estas en el tema de Cambiar tamaño menu CSS desplaza todo en el foro de CSS en Foros del Web. Buenas! A ver, estoy modificando un CSS de una template de Joomla! yo he querido darle más espacio al menú lateral (sidebar) y al hacerlo, ...
  #1 (permalink)  
Antiguo 14/07/2010, 06:34
Avatar de scout_vlc  
Fecha de Ingreso: julio-2007
Ubicación: Valencia
Mensajes: 140
Antigüedad: 10 años, 5 meses
Puntos: 0
Cambiar tamaño menu CSS desplaza todo

Buenas!
A ver, estoy modificando un CSS de una template de Joomla! yo he querido darle más espacio al menú lateral (sidebar) y al hacerlo, el contenido se desplaza debajo del menú.
Si no agrando el menú, el nombre de los items no caben en una linea (imagen 1)



Y si agrando el menú para que los items queden bien, se desmonta el contenido (imagen 2)



¿Cómo puedo arreglarlo?
Además no consigo que los subitems (que en la imagen se ven más a la izquierda), tengan una imagen de fondo diferente a los items principales...
Os pongo parte del código CSS:

Código:
/* begin LayoutCell */
.art-contentLayout .art-sidebar1
{
	position: relative;
	margin: 0;
	padding: 0;
	border: 0;
	float: left;
	overflow: hidden;
	width: 252px;
}
/* end LayoutCell */

/* begin LayoutCell */
.art-contentLayout .art-content
{
	position: relative;
	margin: 0;
	padding: 0;
	border: 0;
	float: left;
	overflow: hidden;
	width: 556px;
}
.art-contentLayout .art-content-sidebar1
{
	position: relative;
	margin: 0;
	padding: 0;
	border: 0;
	float: left;
	overflow: hidden;
	width: 764px;
}
.art-contentLayout .art-content-sidebar2
{
	position: relative;
	margin: 0;
	padding: 0;
	border: 0;
	float: left;
	overflow: hidden;
	width: 784px;
}
.art-contentLayout .art-content-wide
{
	position: relative;
	margin: 0;
	padding: 0;
	border: 0;
	float: left;
	overflow: hidden;
	width: 992px;
}
/* end LayoutCell */

/* begin LayoutCell */
.art-contentLayout .art-sidebar2
{
	position: relative;
	margin: 0;
	padding: 0;
	border: 0;
	float: left;
	overflow: hidden;
	width: 252px;
}
/* end LayoutCell */
Y aquí está completo el CSS. por si alguien peude ayudarme!!!

Última edición por scout_vlc; 14/07/2010 a las 07:29
  #2 (permalink)  
Antiguo 14/07/2010, 08:24
Avatar de yuguilley  
Fecha de Ingreso: febrero-2004
Ubicación: Montenegro Quindío
Mensajes: 108
Antigüedad: 13 años, 10 meses
Puntos: 0
Respuesta: Cambiar tamaño menu CSS desplaza todo

hola, una opcion es que lo que aumente a la columna menú, esa misma cantida se lo quita a la columna contenido. para que no haya desplazamiento hacia abajo.
  #3 (permalink)  
Antiguo 14/07/2010, 09:59
Avatar de scout_vlc  
Fecha de Ingreso: julio-2007
Ubicación: Valencia
Mensajes: 140
Antigüedad: 10 años, 5 meses
Puntos: 0
Respuesta: Cambiar tamaño menu CSS desplaza todo

Lo he intentado, pero no sale.
He modificado los deplazamientos de 'content' ...y nada.
Si echas un vistazo al CSS completo y encuentras dónde debo corregirlo, me harías un gran favor!!
Gracias [email protected]!
  #4 (permalink)  
Antiguo 15/07/2010, 14:18
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Cambiar tamaño menu CSS desplaza todo

Hola:

Por lo menos para mí, sin ver el HTML es difícil saber lo que es cada elemento ni que cambios hacer ¿no tienes la URL?

Saludos.

  #5 (permalink)  
Antiguo 16/07/2010, 04:21
Avatar de scout_vlc  
Fecha de Ingreso: julio-2007
Ubicación: Valencia
Mensajes: 140
Antigüedad: 10 años, 5 meses
Puntos: 0
Respuesta: Cambiar tamaño menu CSS desplaza todo

Gracias por vuestras respuestas!
Ya he conseguido solucionar, de momento, lo del espacio, para agrandar el ancho del menú, sin desmontar la estructura de la página.
Pero sigo teniendo problemas con el CSS del menú, pues no puedo utilizar una imagen diferente para los ítems y otra diferente para los subitems.
Además, no sé como añadir una imagen para el borde superior del menú, y otra para el borde inferior.
Mi idea es:
Borde superior:

Imagen item:

Imagen subítem:

Borde inferior:



Y el CSS completo lo pongo disponible aquí: ver CSS completo

A ver si con vuestra ayuda consigo resolver todo esto, y tengo el menú.
La web la he subido para que esté disponible en:
www.scoutsvalencians.org/web

Muchas gracias!!!!
  #6 (permalink)  
Antiguo 19/07/2010, 03:27
Avatar de scout_vlc  
Fecha de Ingreso: julio-2007
Ubicación: Valencia
Mensajes: 140
Antigüedad: 10 años, 5 meses
Puntos: 0
Respuesta: Cambiar tamaño menu CSS desplaza todo

¿Alguien viendo el CSS puede ayudarme a conseguir lo que quiero ?

Última edición por scout_vlc; 19/07/2010 a las 03:28 Razón: corregir una falta ortográfica
  #7 (permalink)  
Antiguo 19/07/2010, 18:17
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Cambiar tamaño menu CSS desplaza todo

Hola:

Por lo que he podido deducir de tu código los div art-BlockContent son lo que generan el borde del menú pero en tu CSS no indicas cual es la imagen de fondo que intuyo son las que muestras en el mensaje 5.

Saludos.

  #8 (permalink)  
Antiguo 20/07/2010, 03:04
Avatar de scout_vlc  
Fecha de Ingreso: julio-2007
Ubicación: Valencia
Mensajes: 140
Antigüedad: 10 años, 5 meses
Puntos: 0
Respuesta: Cambiar tamaño menu CSS desplaza todo

Hola jomauro!
Será que lo mío no es el CSS, pero es que no consigo encontrar qué art-BlockContent es el que indica en template.css el borde inferior.
Estoy mirando el .art-BlockContent-bc, .art-BlockContent-tc añadiendo el ancho y alto, probando con colores de fondo... pero nada... me sale el color de fondo sólo en el espacio que hay entre los ítems del menú....
  #9 (permalink)  
Antiguo 20/07/2010, 16:41
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Cambiar tamaño menu CSS desplaza todo

Hola:

Revisando con mucha calma porque el código está muy liado he descubierto que la parte superior del menú está en sidebar-up y la parte inferior en sidebar-down.

Un consejo revisa todo el css y suprime el punto y coma después de cada cierre de comentario (*/) te está creando muchos problemas.

Saludos.

  #10 (permalink)  
Antiguo 21/07/2010, 03:01
Avatar de scout_vlc  
Fecha de Ingreso: julio-2007
Ubicación: Valencia
Mensajes: 140
Antigüedad: 10 años, 5 meses
Puntos: 0
Respuesta: Cambiar tamaño menu CSS desplaza todo

Gracias por tu mensaje!
Lo de "sidebar-up" y "sidebar-down" lo creé yo para probar, y poner "a pelo" las imágenes.
Pero la inferior no funciona, porque al ponerla directamente yo con la posición, en cuanto clicas el menú y se desplegan los subitems, la imagen inferior sigue apareciendo en la posición que indiqué en el CSS, es decir...queda a mitad del menú....

Vamos... que no sé ni cómo poner la imagen superior e inferior del menú, ni cómo utilizar una imagen de fondo diferente para los ítems principales y otra diferente para los subítems.

Aquí está la plantilla completa, el CSS original del template gratuito y su index.php original.
¡Gracias por vuestra ayuda!

Etiquetas: desplaza, tamaño, todo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:06.