Foro diseño/web/editorial

» Diseo Web

Diferenciar estilos de divs contenidos dentro de una class con otros estilos

(8 mensajes)
  1. jfcolomer
    Miembro

    Muy buenas, llevo ya unos das 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 seccin del accordion y quiero aadir contenido pues no hay problema, pero a la hora de aadir una lista de trminos, 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.

    Publicado hace 9 años #
  2. ceslava
    admin

    Hola Juan,


    Parece un problema de especificad CSS, has probado #wizards li ?

    Saludos

    Publicado hace 9 años #
  3. jfcolomer
    Miembro

    Hola Cristian, gracias por responder ;)
    Pues la verdad es que s y no hay manera, pero he probado a aadir 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.

    Publicado hace 9 años #
  4. ceslava
    admin

    Hola Juan,


    No te hace falta tanto, lo que le da la altura de 480px es

    ul.accordion li

    Si a #wizards li le pones una altura con height lo tendrs solucionado.

    Es cuestin de especificidad y los ID tienen ms valor que las clases. 

    Saludos

    Publicado hace 9 años #
  5. jfcolomer
    Miembro

    Hola 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 tambin 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 debera 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 trminos (especialidad1,.....)

    No s si me estoy explicando bien :S

    Publicado hace 9 años #
  6. ceslava
    admin

    Hola 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 frmula muy sencilla de aplicar una vez entendida. 

    Te dejo tambin esta lectura sobre CSS


    Y tambin te recomiendo que instales Firebug para Firefox, de esta forma vers los estilos ordenados por especificidad que se estn aplicando.

    Saludos

    Publicado hace 9 años #
  7. jfcolomer
    Miembro

    Muchas gracias Cristian ;)

    Publicado hace 9 años #
  8. hostpapa
    Miembro

    Se ve que has podido arreglar todo porque el sitio se ve muy bueno!

    Publicado hace 9 años #

RSS feed para este Tema

Responder

Debes Identificarte para publicar.