Design das tabelas

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Design das tabelas

Mensagem por afroument em 03/02/14, 12:52 am

Qual é minha questão:
Gostaria de saber como posso deixar a aparência clean assim. Por clean eu digo sem divisórias que tem no meu fórum ali nas tabelas. Poder diminuir o tamanho e enfim, como consta nesta imagem.

E separadamente, mas como posso aumentar a borda?

Endereço do meu fórum:
http://beauxbatons.rpgwars.org

Versão do fórum:
PHPBB2
avatar

afroument
Nível 5

Feminino
Inscrito dia : 03/04/2013
Mensagens : 42
Pontos Ativos : 72

Ver perfil do usuário http://secretgarden.forumeiros.com/

Resolvido Re: Design das tabelas

Mensagem por Shek em 03/02/14, 01:17 pm

Boa tarde!

Você poderia me informar a URL do site que viu o efeito?

Até mais!


Shek CrowleyAdmineiro - Fórum dos Fóruns

Clicar no botão ou no OBRIGADO não mata ninguém!
avatar

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 17161
Pontos Ativos : 21418

Ver perfil do usuário http://www.shiftactif.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

Resolvido Re: Design das tabelas

Mensagem por afroument em 03/02/14, 01:23 pm

Boa tarde!

Claro, é http://www.isolemnlyswear.net/
avatar

afroument
Nível 5

Feminino
Inscrito dia : 03/04/2013
Mensagens : 42
Pontos Ativos : 72

Ver perfil do usuário http://secretgarden.forumeiros.com/

Resolvido Re: Design das tabelas

Mensagem por :-EraGon-: em 03/02/14, 01:57 pm

Olá amigo, tente esse Code HTML
Código:
<span class="desc1"><div style="" align="center">
    <img src="http://i.imgur.com/7GS5MvG.png" />
</div><br>Aquí encontrarás todos los reglamentos necesarios para que tu estancia en el foro sea lo más tranquila posible. No cabe decir que todas y cada una de las reglas aquí expuestas han de ser cumplidas por todos y cada uno de los miembros del foro. <br /><br /><div style="" align="center">
    <img src="http://i.imgur.com/bAFzar6.png" />
</div></span><br /><strong></strong> </div></dd><dd class="topics">2 <dfn>Temas</dfn></dd><dd class="posts">2 <dfn>Mensajes</dfn></dd><dd class="lastpost"><span><a href="/t3359-reglamento-de-los-roles" title="Reglamento de los Roles.">Reglamento de los Roles....</a><br />Lun Oct 07, 2013 11:01 am<br /><strong><a href="/u1" class="gensmall"><span style="color:#B0B0B0" class="color-groups"><strong>I Solemnly Swear</strong>
avatar

:-EraGon-:
Nível 9

Masculino
Inscrito dia : 12/12/2013
Mensagens : 224
Pontos Ativos : 414

Ver perfil do usuário http://suporteparaforuns.forumeiros.com https://www.facebook.com/facebook.com/hilterhp https://twitter.com/@HilterHP

Resolvido Re: Design das tabelas

Mensagem por afroument em 03/02/14, 03:14 pm

Não acho que isso resolva... eu queria um código pro css [digo, creio que tem que ser por lá] que faça com que essas partes que eu indiquei do fórum [mas no meu, claro] fiquem assim, que eu tenha como mudar o tamanho que fica em volta do que tá escrito...
avatar

afroument
Nível 5

Feminino
Inscrito dia : 03/04/2013
Mensagens : 42
Pontos Ativos : 72

Ver perfil do usuário http://secretgarden.forumeiros.com/

Resolvido Re: Design das tabelas

Mensagem por :-EraGon-: em 03/02/14, 04:11 pm

Olá novamente afroument por acaso o site que me passou é de suporte forumeiros.com ? se não for, nos não fornecemos suporte para outros sites que não sejam da Hospedagem forumeiros.com
avatar

:-EraGon-:
Nível 9

Masculino
Inscrito dia : 12/12/2013
Mensagens : 224
Pontos Ativos : 414

Ver perfil do usuário http://suporteparaforuns.forumeiros.com https://www.facebook.com/facebook.com/hilterhp https://twitter.com/@HilterHP

Resolvido Re: Design das tabelas

Mensagem por afroument em 03/02/14, 05:05 pm

Não tenho certeza. Mas este é. Onde avisa quantas respostas tem e etc também é menor, proporcional.
avatar

afroument
Nível 5

Feminino
Inscrito dia : 03/04/2013
Mensagens : 42
Pontos Ativos : 72

Ver perfil do usuário http://secretgarden.forumeiros.com/

Resolvido Re: Design das tabelas

Mensagem por Gaaratsu em 04/02/14, 02:44 pm

Saudações minha querida!

Queira aceder à:
Painel de Controle >> Visualização >> Imagens e Cores >> Cores >> Folha de estilo CSS

Lá, a senhora deverá adicionar o código abaixo no início da tua CSS:
Código:
.table-title, .table-title h2 {
color: #fff;
font-family: Oswald;
font-size: 33px;
font-weight: lighter;
text-transform: uppercase;
display: inline;
}
.table-title h2, li.header dl.icon dd.dterm {
text-align: center;
}
.forabg li.header dd.dterm {
text-align: center;
width: 100%;
}
dl.icon dd.dterm, dl.icon dt {
background-position: 5px 50%;
background-repeat: no-repeat;
}
ul.topiclist dd.dterm, ul.topiclist dt {
display: block;
float: left;
font-size: 1.1em;
padding-left: 5px;
padding-right: 5px;
width: 60%;
}
ul.topiclist dd {
border-left: 1px solid transparent;
display: block;
float: left;
padding: 4px 0;
}
dd {
display: block;
-webkit-margin-start: 40px;
}
li.header dd, li.header dt {
border-left-width: 0;
color: #;
font-family: Tahoma,Tahoma;
font-size: 1em;
line-height: 1em;
margin: 2px 0 4px;
padding-bottom: 2px;
padding-top: 2px;
text-transform: uppercase;
}
li.header dd {
margin-left: 1px;
}
.forabg li.header dd.topics {
background-color: transparent;
color: transparent;
display: none;
height: 0;
padding: 0;
}
ul.topiclist li.header dl dd {
border: none;
}
.forabg dd.topics {
background: #0e0d0d;
color: #fff;
font-family: calibri;
font-size: 10px;
height: 5px;
line-height: .6em;
margin-left: 108px;
margin-top: 50px;
padding: 10px;
text-shadow: 1px 1px 1px #000;
text-transform: uppercase;
vertical-align: middle;
width: 60px;
}
dd.posts, dd.topics, dd.views {
border: none;
font-size: 1.2em;
line-height: 2.2em;
text-align: center;
width: 8%;
}
dd.lastpost {
font-size: 1.1em;
width: 20%;
}
li.header {
color: #fff;
font-family: georgia;
font-size: 10px;
font-weight: lighter;
text-align: center;
}
ul.forums {
background: #1b1817;
border: 8px solid #3f3937;
color: #fff;
}
.forabg {
background-color: #;
background-image: url(http://illiweb.com/fa/empty.gif);
background-position: 0 0;
background-repeat: repeat-x;
border: 2px solid #;
clear: both;
margin-bottom: 4px;
padding: 0 5px;
}
DIV.h3 {
color: #69605d;
font-family: Astloch;
font-size: 40px;
font-style: normal;
font-variant: normal;
font-weight: normal;
text-transform: lowercase;
}
.h3 {
font-weight: 700;
}

Não se esqueça de salvar! Positivo

Cordiais saudações! Muito feliz
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6005
Pontos Ativos : 7504

Ver perfil do usuário http://narutongo.forumeiros.com/

Resolvido Re: Design das tabelas

Mensagem por afroument em 04/02/14, 07:00 pm

Não mudou nada =/
avatar

afroument
Nível 5

Feminino
Inscrito dia : 03/04/2013
Mensagens : 42
Pontos Ativos : 72

Ver perfil do usuário http://secretgarden.forumeiros.com/

Resolvido Re: Design das tabelas

Mensagem por JScript em 04/02/14, 09:27 pm

@afroument

Olá, o máximo que eu consegui até agora utilizando apenas CSS foi esse resultado:


Se gostou, entre no painel de controle de seu fórum e vá em Visualização -> Imagens e cores -> Cores, selecione a aba Folha de estilos CSS e adicione o código abaixo:
Código:

table .forumline {
  border-collapse: collapse !important;
}
table .forumline tr:nth-of-type(1) th {
  color: rgba(0, 0, 0, 0) !important;
}
table .forumline tr:nth-of-type(2) td:nth-of-type(3) span {
    margin-left: 70px;
    margin-top: -100px;
    position: absolute;
}
table .forumline tr:nth-of-type(2) td:nth-of-type(3) span:after {
    content: " Tópicos";
    font-size: 12px;
}
table .forumline tr:nth-of-type(2) td:nth-of-type(4) {
  background-color: rgba(0, 0, 0, 0);
}
table .forumline tr:nth-of-type(2) td:nth-of-type(4) span {
    margin-left: 100px;
    margin-top: -100px;
    position: absolute;
}
table .forumline tr:nth-of-type(2) td:nth-of-type(4) span:after {
    content: " Post";
    font-size: 12px;
}
table .forumline tr:nth-of-type(2) td:nth-of-type(5) {
  display: block;
  margin-left: -78px;
  padding-bottom: 90%;
  padding-top: 30%;
}

Abraços,

JS
avatar

JScript
Membro do Fórum

Masculino
Inscrito dia : 14/03/2013
Mensagens : 1449
Pontos Ativos : 1900

Ver perfil do usuário http://jscript.forumeiros.com/

Resolvido Re: Design das tabelas

Mensagem por afroument em 04/02/14, 10:47 pm

Adorei assim, mas o problema é que não vai em todos e uns outros ficam com espaços enooormes em branco.

Mas nãoi entendo como em um fórum dá e outro não. E eu não consigo decifrar o css daquele pra saber como fizeram.

avatar

afroument
Nível 5

Feminino
Inscrito dia : 03/04/2013
Mensagens : 42
Pontos Ativos : 72

Ver perfil do usuário http://secretgarden.forumeiros.com/

Resolvido Re: Design das tabelas

Mensagem por JScript em 04/02/14, 11:23 pm

@afroument
Vou lhe explicar a importância do item Endereço do meu fórum:
Quando você preenche o formulário para postar um novo tópico, esse item é de especial importância pois tudo o que fazemos é voltado ao endereço que é postado neste campo!
Isso significa que se um código foi feito para o endereço informado e o autor tenta aplicar em outro, nem sempre irá funcionar, mesmo que seja da mesma versão pois podem existir pequenas diferenças devido a outras alterações.
Em outras palavras: Fiz o código baseado neste fórum http://beauxbatons.rpgwars.org/

Abraços,

JS
avatar

JScript
Membro do Fórum

Masculino
Inscrito dia : 14/03/2013
Mensagens : 1449
Pontos Ativos : 1900

Ver perfil do usuário http://jscript.forumeiros.com/

Resolvido Re: Design das tabelas

Mensagem por afroument em 04/02/14, 11:57 pm

Sim, é para este mesmo. Só estou mostrando o modelo de um outro forum que eu queria entender como fazer isso, pois não quero mudar todo o tema. Esta última imagem que postei, por exemplo, é deste, um meu tbm: http://ceilove.forumeiros.com/
avatar

afroument
Nível 5

Feminino
Inscrito dia : 03/04/2013
Mensagens : 42
Pontos Ativos : 72

Ver perfil do usuário http://secretgarden.forumeiros.com/

Resolvido Re: Design das tabelas

Mensagem por JScript em 05/02/14, 12:20 am

@afroument escreveu:Sim, é para este mesmo. Só estou mostrando o modelo de um outro forum que eu queria entender como fazer isso, pois não quero mudar todo o tema. Esta última imagem que postei, por exemplo, é deste, um meu tbm: http://ceilove.forumeiros.com/
Este fórum está em desacordo com as regras da Forumeiros pois #page-footer está oculto e com isso retira os créditos da plataforma:


Só está aparecendo na imagem acima porque eu desmarquei a propriedade font-size: 0 !
Trate de remover o código abaixo do seu CSS ou seu fórum será reportado:
Código:

ul.linklist li.rightside, li.rightside a.copyright {
    display: inline !important;
    font-size: 0;
}

Tópico bloqueado

JS
avatar

JScript
Membro do Fórum

Masculino
Inscrito dia : 14/03/2013
Mensagens : 1449
Pontos Ativos : 1900

Ver perfil do usuário http://jscript.forumeiros.com/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum