• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Splitting Category Nodes

Dynamic

Well-known member
#1
Hey guys, sorry for all the questions. Hopefully it will help others out too.

Is there a way to split up the node list to display a different "table" for each category?

Right now it looks like this

|--------------------------------------|
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
| |
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
| |
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
|---------------------------------------|

I would like it to look like this

|--------------------------------------|
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
|---------------------------------------|

|--------------------------------------|
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
|---------------------------------------|


|--------------------------------------|
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
|---------------------------------------|

Any help would be great :D

Thanks.
 

Forsaken

Well-known member
#2
Hey guys, sorry for all the questions. Hopefully it will help others out too.

Is there a way to split up the node list to display a different "table" for each category?

Right now it looks like this

|--------------------------------------|
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
| |
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
| |
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
|---------------------------------------|

I would like it to look like this

|--------------------------------------|
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
|---------------------------------------|

|--------------------------------------|
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
|---------------------------------------|


|--------------------------------------|
|Cat Name |
| |
|Node1 |
|Node2 |
|Node3 |
|Node4 |
|---------------------------------------|

Any help would be great :D

Thanks.
http://www.se7ensins.com/forums/

Something similar to the way their categories are?
 

Dynamic

Well-known member
#5
Hi Forsaken,

It did not work. It moved the titles down, but did not make each of them their own little box. The background colour is still visible between the lists.

Thanks.
 

Forsaken

Well-known member
#6
Code:
.nodeList .category { 
background-color: #FFFFFF;
border-bottom-color: #E0E0E0;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-left-color: #E0E0E0;
border-left-style: solid;
border-left-width: 1px;
border-right-color: #E0E0E0;
border-right-style: solid;
border-right-width: 1px;
border-top-color: #E0E0E0;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-top-style: solid;
border-top-width: 1px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
position: relative;
}
Thats the code I used for Se7enSins, so it should work.
 

gldtn

Well-known member
#9
Code:
.nodeList .category {
background-color: #FFFFFF;
border-bottom-color: #E0E0E0;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-left-color: #E0E0E0;
border-left-style: solid;
border-left-width: 1px;
border-right-color: #E0E0E0;
border-right-style: solid;
border-right-width: 1px;
border-top-color: #E0E0E0;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-top-style: solid;
border-top-width: 1px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
position: relative;
}
How about turning that into this ;)

Code:
.nodeList .category {
    background-color: #FFFFFF;
    border: 1px solid #E0E0E0;
    border-radius: 5px;
    padding: 5px;
    position: relative;
}