Foros del Web » Creando para Internet » CSS »

Categorias y subcategorias.

Estas en el tema de Categorias y subcategorias. en el foro de CSS en Foros del Web. Saludos a todos he buscado en el foro y no localizo la solucion. Tengo las categorias de la siguiente forma Principal 1 - Subcategoria 1 ...
  #1 (permalink)  
Antiguo 05/05/2009, 16:52
Avatar de David_dfd  
Fecha de Ingreso: febrero-2005
Ubicación: Tenerife
Mensajes: 311
Antigüedad: 12 años, 9 meses
Puntos: 2
Categorias y subcategorias.

Saludos a todos he buscado en el foro y no localizo la solucion.

Tengo las categorias de la siguiente forma

Principal 1
- Subcategoria 1
- Subcategoria 2

Principal 2

Principal 3
- Subcategoria 3
- Subcategoria 4

El tema es que en la plantilla no aparecen asi, en forma de ¿Arbol?, y me gustaria saber como puedo hacerlo para que aparescan de esa forma.

Gracias
  #2 (permalink)  
Antiguo 05/05/2009, 17:06
Avatar de metacortex
Viejo demente
 
Fecha de Ingreso: junio-2004
Ubicación: Caracas - Venezuela
Mensajes: 9.020
Antigüedad: 13 años, 6 meses
Puntos: 832
Respuesta: Categorias y subcategorias.

La estructura HTML existe por defecto (listas dentro de listas). Lo que resta es que le definas los estilos mediante CSS.

Debes mirar el código fuente para enterarte de las clases asignadas a las listas generadas. De esa forma podrás asignarles estilos. Fíjate en este ejemplo en el cual elaboré el mapa del sitio sólo con list_categories. El grueso del trabajo correspondió a la parte del CSS.
  #3 (permalink)  
Antiguo 06/05/2009, 04:57
Avatar de David_dfd  
Fecha de Ingreso: febrero-2005
Ubicación: Tenerife
Mensajes: 311
Antigüedad: 12 años, 9 meses
Puntos: 2
Respuesta: Categorias y subcategorias.

Muchas gracias por tu respuesta.

Mi themes crea la lista de la siguiente forma:

Código PHP:
<div class="SR">
 <
div class="SRL">
 <
div class="Categories">
   <
h2><strong>Categories</strong></h2>
   <
ul>
        <
li class="cat-item cat-item-1"><a href="" title="">Principal 1</a></li>
    <
li class="cat-item cat-item-14"><a href="" title="">Principal 2</a>

<
ul class='children'>
    <
li class="cat-item cat-item-25"><a href="">Sub 1</a></li>
    <
li class="cat-item cat-item-6"><a href="">Sub 2</a></li>
</
ul>
        <
li class="cat-item cat-item-X"><a href="" title="">Principal 3</a></li>
   </
ul>
   </
div
El codigo que usa en el css para dar forma es este:

Código PHP:
/* Right Column */
.SR floatrightwidth369pxmargin-left21pxpadding-bottom4pxbackground#eaf4ff url(./images/SRBkg.gif) no-repeat left bottom;}
.SR h2 font-size14pxletter-spacing: -1pxpadding5px 0pxmargin0pxborder-bottomsolid 1px #d4e3f4; color:#323740;}
.SR ul padding0pxmargin0px;}
.
SR li padding0pxmargin0px; list-style-typenone;}
.
SR li a padding2px 0px 3px 8pxcolor#003366; text-decoration: none; border-bottom: solid 1px #d4e3f4; background: url(images/CategIco.png) no-repeat left top; width: 152px; display: block;}  
.SR li a:visited color#003366; text-decoration: none; border-bottom: solid 1px #d4e3f4;} 
.SR li a:hover text-decorationunderlinecolor#000033; border-bottom: solid 1px #d4e3f4;} 

/* Right - First Column */
.SR .SRL floatleftwidth160pxpadding15px 0px 15px 15pxmargin-right11pxbackground:  url(./images/SRLBkg.gifno-repeat left top;}

/* Right - Second Column */
.SR .SRR floatrightwidth170pxpadding15px 10px 15px 0pxbackgroundurl(./images/SRRBkg.gifno-repeat right top;}
 
 
.
Categories margin-bottom20px;}
.
Links margin-bottom20px;}
.
Archives margin-bottom20px;}
.
Meta {}
.
Calendar {}
.
Calendar caption background#d4e3f4; padding: 5px 0px;}
.Calendar table width170pxbordersolid 1px #d4e3f4;}
.Calendar table th text-aligncenterletter-spacing: -1pxborder-bottomsolid 1px #d4e3f4; padding: 3px 0px;}
.Calendar table td text-aligncenterpadding3px 0pxfont-size11px;} 
Segun creo entender deberia añadir algo como:

Código PHP:
ul ul.children {
    
padding-left0;
    
padding-right4px;

Pero no se cual es el codigo añadir para que los ul con la etiqueta "children" tengan la funcion "padding-right: 4px;".

¿Me podeis ayudar? Muchas gracias
  #4 (permalink)  
Antiguo 06/05/2009, 06:10
Avatar de metacortex
Viejo demente
 
Fecha de Ingreso: junio-2004
Ubicación: Caracas - Venezuela
Mensajes: 9.020
Antigüedad: 13 años, 6 meses
Puntos: 832
Respuesta: Categorias y subcategorias.

Muy bien, pero veo que estás fijando la izquierda en cero (que es lo que necesitas). Recuerda que <ul> es un contenedor en sí, por lo cual puedes aplicar el margen sin problemas:

Código css:
Ver original
  1. ul.children {
  2.   margin-left: 20px;
  3. }

Creo que en el foro de CSS podrán ayudarte mejor. Movido desde Wordpress.
  #5 (permalink)  
Antiguo 06/05/2009, 08:09
Avatar de David_dfd  
Fecha de Ingreso: febrero-2005
Ubicación: Tenerife
Mensajes: 311
Antigüedad: 12 años, 9 meses
Puntos: 2
Respuesta: Categorias y subcategorias.

Muchas gracias, justo funciono.

Gracias de nuevo por tu ayuda.
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 19:07.