Foro › Foros › Diseño Web › Diferenciar estilos de divs contenidos dentro de una class con otros estilos
Etiquetado: css, css class div, especificidad
- Este debate está vacío.
-
AutorEntradas
-
mayo 3, 2011 a las 6:32 pm #218Anónimo
Muy buenas, llevo ya unos días bastante perdido con el siguiente problema.
Estoy desarrollando el siguiente sitio http://juanfolgarlouroabogados.es/index2.html
y el caso es que el menu está compuesto por un «accordion» en javascript que se va desplegando para mostrar las distintas secciones de la web, hasta ahí todo bien, el caso es que el accordion está compuesto por una ul en la que cada li es una de las secciones del menú, luego cada li tiene una altura y anchura antes de desplegarse.
Una vez que despliego una sección del accordion y quiero añadir contenido pues no hay problema, pero a la hora de añadir una lista de términos, estos heredan la altura y anchura de cada uno de los li del accordion antes de desplegarse, y como podeis ver en la seccion OFICINAS, me muestra cada li con esa altura y anchura.
He probado con !important, con background-image:none pero no hay forma.
A alguien se le ocurre algo?
Gracias.mayo 3, 2011 a las 6:44 pm #1424Hola Juan,
Parece un problema de especificad CSS, ¿has probado #wizards li ?Saludosmayo 4, 2011 a las 6:06 am #1425AnónimoHola Cristian, gracias por responder
Pues la verdad es que sí y no hay manera, pero he probado a añadir esto al final de mi hoja de estilos:
ul.accordion li.bg1 .description li{
height:5px;
width:5px;
}
Si le pongo width y height, me muestra los li con dicha altura y anchura, si lo suprimo, les da la misma altura y anchura que tienen los li del accordion antes de ser desplegados, es decir, unos 135 de anchura por 480 de altura.mayo 4, 2011 a las 8:38 am #1426Hola Juan,
No te hace falta tanto, lo que le da la altura de 480px esul.accordion liSi a #wizards li le pones una altura con height lo tendrás solucionado.Es cuestión de especificidad y los ID tienen más valor que las clases.Saludosmayo 4, 2011 a las 4:50 pm #1427AnónimoHola Cristian, ya voy acotando el problema
Como bien dices, les he dado una altura y anchura al #wizards li y solucionad, bueno, una vez quitado también su respectivo border-right y border-bottom.http://www.juanfolgarlouroabogados.es/index2.html
Lo que pasa que he intentado hacer lo mismo para una lista normal y corriente (accordion ESPECIALIDADES) , es decir, de texto, y claro, no me debería hacer falta darles altura y anchura no? porque si se la doy, como he hecho:
ul.accordion li.bg0 .description li{
height:5px;
width:20px;
border-right:0px;
border-bottom:0px;
}Pues me sigue saliendo el dichoso fondo de marras, y si no le doy ninguna pues hereda la del ul.accordion li y en el caso de dejarsela a cero, pues resulta que no me aparecen los términos (especialidad1,…..)
No sé si me estoy explicando bien :S
mayo 4, 2011 a las 5:43 pm #1428Hola Juan,
Te recomienda que leas sobre la especificidad CSS, por ejemplo aquí:Se trata de que entiendas qué selector tiene prioridad cuando hay conflictos.Se trata de una fórmula muy sencilla de aplicar una vez entendida.Te dejo también esta lectura sobre CSSY también te recomiendo que instales Firebug para Firefox, de esta forma verás los estilos ordenados por especificidad que se están aplicando.Saludosmayo 4, 2011 a las 6:00 pm #1429AnónimoMuchas gracias Cristian
mayo 8, 2011 a las 11:16 pm #1430AnónimoSe ve que has podido arreglar todo porque el sitio se ve muy bueno!
-
AutorEntradas
- Debes estar registrado para responder a este debate.