Quadro do forum

[CM Remedy]

Qual é minha questão:
Olá a todos, eu e um amigo estamos a criar um forum e nós gostavamos de ter o quadro dos topicos do forum fosse assim:



Falo do modelo do quadro claro, só com a cor em cima e depois as categorias sem barras laterais.

Codigo CSS do meu forum caso necessario: 

Código:

#wrap {
-moz-border-radius : 8px;
-webkit-border-radius : 8px;
}




.navbar {
background-image: url('');
background-repeat: repeat-x;
border : 1px solid #CCCCCC; 
}




.navbar {
background-image: url(');
background-repeat: repeat-x;
border : 1px solid #CCCCCC; 
}












a.opacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;}




a.opacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}




















.forumbg .header{margin-bottom: 3px;}








.header{text-align: center;}








.forumbg .views{padding-left: 20px;}




div#page-header div.navbar {
background-color: transparent;}
















.icon dd.posts {
margin-left: 10px;
}




















#text_editor_controls a.button2,#text_editor_controls input.button2,#text_editor_controls button.button2{
background-image: url(http://i66.servimg.com/u/f66/13/46/75/82/untitl31.png);
color: black;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
padding: 3px;}












.icon-home{
background: url(http://i66.servimg.com/u/f66/13/46/75/82/untitl16.png) no-repeat top;
padding: 12px;
padding-bottom: 20px;
color: transparent !important;
font-size: 0px !important;}




.icon-home:hover{
background: url(http://i66.servimg.com/u/f66/13/46/75/82/home_h10.png) no-repeat top;
color: transparent;}












.introduction, .panel, .post {
background-color: #F5F5F5;
border: 1px solid ;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-color: #dcdcdc;
}








#wrap {
width : 1000px;
padding : 5px;
border : 6px solid #EEE;
-moz-border-radius : 7px;
-webkit-border-radius : 7px;
-moz-box-shadow : 0 0 10px #666;
-webkit-box-shadow : 0 0 10px #666;
}
































#search-box{position: center;
bottom: 50px;
height: 80px;
width: 185px;
right: -50px;
display: inline;
background: transparent url(http://i66.servimg.com/u/f66/13/46/75/82/bgsear10.png) no-repeat center;}




#search-box input.button2 {
display: none;}




#search-box #keywords {
width: 68px;
color: white;
text-shadow: #000000 0px 0px 2px;
background: transparent;}




#search-box input {
border: none !important;
background: none;}




#search-box input.search {
background: none;
margin-left: 50px;
margin-top: 31px;}




ul.linklist li a img:hover {
filter:alpha(opacity=70); 
-moz-opacity: 0.65; 
opacity: 0.65;
position: relative; 
top: -1px;
cursor:allowed;
}




#page-footer div.navbar{ background-image: url('http://hitskin.com/themes/15/03/45/i_list_bg.png'); background-repeat: repeat-x; font-size: 9px; -moz-border-radius : 15px; -webkit-border-radius : 15px; } #page-footer ul li a { letter-spacing : -1px; color: #ffffff; }




#search-box{position: center;
bottom: 50px;
height: 80px;
width: 185px;
right: -100px;
display: inline;
background: transparent url(http://i66.servimg.com/u/f66/13/46/75/82/search15.png) no-repeat center;}




#search-box input.button2 {
display: none;}




#search-box #keywords {
width: 70px;
background: transparent;}




#search-box input {
border: none !important;
background: none;}




#search-box input.search {
background: none;
margin-left: 58px;
margin-top: 34px;}




ul#picture_legend {
background-position: center;
background-repeat: no-repeat;
background-image: url('http://i66.servimg.com/u/f66/13/46/75/82/shape_16.png');
text-align: center;
padding: 24px 0;}








.forumbg, .forabg {
-moz-border-radius: 10px 0 10px 0;
-webkit-border-radius: 10px 0 10px 0;
}
.forumbg .corners-top, .forumbg .corners-bottom, .forabg .corners-top, .forabg .corners-bottom {
display: none;
}
.forumbg, .forabg {
padding-bottom: 6px;
}
.postprofile {
text-align: center;
}

Endereço do meu fórum:
http://check-point.foruns.com.pt/

Versão do fórum:
PHPBB3

[JhonatanQueiros]

Boas,
disponibiliza uma imagem do assunto, ou, seja mais explicativo.
Abraço.

[MateusA]

Olá!

Onde o senhor viu tal categoria?

Até mais.

[CM Remedy]

A imagem está explicita, é o quadro onde diz o Numero de topicos , o nome da categoria e o numero de posts, ou seja o quadro.

Vi as categorias num forum demo.

[Sennior]

Olá amigo,

Seria essencial se tivesse o link, mas tudo bem.
Tente este código CSS colocando ele no inicio da tua Folha:
Painel de Controle Visualização Imagens e Cores Cores Folha De Estilo CSS

Código:

.forabg {
background-color: rgb(0, 0, 0) !important;
background-image: none !important;
background-position: 0px 0px;
background-repeat: repeat-x;
border: 2px solid rgb(240, 240, 240);
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
clear: both;
margin-bottom: 4px;
padding: 0px 5px;
}

Abraços.

[CM Remedy]

Sem efeito.
O Link: http://demo.phpbb3styles.net/Alpha

[goodbye]

Olá!

Experimente o código abaixo:

Código:

li.row {
border-top-color: #F0E7E7;
border-bottom-color: #e9e9e9;
padding: 6px;
}
li.row {
border-top: 1px solid #FFFFFF;
border-bottom: 1px solid #8f8f8f;
}
.forabg {
background-color: #313435;
background-image: none;
background-position: 0 0;
background-repeat: repeat-x;
border: none;
clear: both;
margin-bottom: none;
padding: 0;
}

Adicionar em:
Painel de Controle ->> Visualização ->> Imagens e Cores ->> Cores / Folha de estilo CSS

Valide!

Resulta?

[CM Remedy]

Desculpem o double-post mas queria avisar também que o quadro dos tópicos é para ficar igual ao das categorias, o que ainda não aconteceu, ainda só mudou o quadro das categorias.

[goodbye]

Double-post não serão tolerados antes de se ter passado 24 horas, prefira editar a mensagem anterior. Já está avisado.

Adicione o código abaixo na folha:

Código:

.row {
padding: 4px;
}
.forumbg {
background-color: #3D3D3D;
border-radius: 2px;
background-image: none!important;
background-position: 0 0;
background-repeat: repeat-x;
border: none;
clear: both;
margin-bottom: 0px;
padding: 0px;
}
li.header dd, li.header dt {
position: relative;
left: 3px;
}

Resulta?