Olá pessoal, a um bom tempo havia visto um tópico ensinando a colocar as informações do perfil em quadros.. mais não acho ele mais e estou querendo colocar...
É assim que quero o perfil:
(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fi53.tinypic.com%2Fxepzfc.png&hash=0837f6abb690dd7677f1761eb817c41c35dc3e38)
tudo em quadros as informações.. tem como me dar essa ajuda?
O arquivo index.css deve ser editado.
.poster
{
float: left;
width: 15em;
}
.poster
{
float: left;
width: 15em;
border: 1px black solid;
}
Faça um teste e veja se resulta...
Não resultou ainda..
ficou assim olha:
(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fi51.tinypic.com%2Ft8axrs.png&hash=fa8aec02bfe9054a3d446aed45d8888ca44d7add)
Opa, código errado. Mas, vamos manter ele aí, quem sabe ajuda numa questão próxima a isto.
Agora para seu problema:
/* poster details and list of items */
.poster h4, .poster ul
{
padding: 0;
margin: 0 1em 0 1.5em;
}
.poster h4
{
margin: 0.2em 0 0.4em 1.1em;
font-size: 120%;
}
/* poster details and list of items */
.poster h4, .poster ul li
{
border: solid 1px #BFBFCB;
margin-bottom: 4px;
margin-left: 8px;
padding: 4px;
text-align: center;
color: #3f3f3f;
width: 79%;
}
...
Muito obrigado Spectrum, vc está me ajudando mto mesmo, tenho nem como agradecer.. tá ai o resultado final:
(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fi51.tinypic.com%2F2zqa9zt.png&hash=295fb9ff93f7b3f7f7da9b15ad467f7c2aa2428b)
Só mais 1 dúvida antes de dar como resolvido, é possivel remover os quadros dos status ali? Os status que eu digo são esses da img que tem 3 quadradinhos pequenos... no email, na mensagem pessoal e no ver perfil?
Andei fuçando aqui no css e acabei conseguindo, dei uma pequena modifica.. como de feedback..
Resultado:
(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fi53.tinypic.com%2F6y38mq.png&hash=5c2358d6381403a4274432ba783c7ae839a1ebc8)
Uma breve explicação do que fiz, editei do:
/* poster details and list of items */ até /* The quick buttons */
Então é só substituir tudo que está entre esses 2 com isso:
/* poster details and list of items */
.poster h4, .poster ul
{
padding: 0;
margin: 0 8px;
}
.poster h4
{
font-size: 120%;
}
.poster h4, .poster h4 a
{
color: #0474b4;
}
.poster ul ul
{
margin: 0.3em 1em 0 0;
padding: 0;
}
.poster ul ul li
{
display: inline;
background: none;
border: none;
}
.poster ul li, .poster h4 {
background: #fcfcfc;
border: solid 1px #ddd;
margin-bottom: 2px;
text-align: center;
padding: 4px;
color: #3f3f3f;
}
.poster ul li {
width: 94%;
}
.poster li.warning
{
line-height: 1.2em;
padding-top: 1em;
}
.poster li.warning a img
{
vertical-align: bottom;
padding: 0 0.2em;
}
.messageicon
{
float: left;
margin: 0 0.5em 0 0;
}
.messageicon img
{
padding: 6px 3px;
}
.keyinfo
{
float: left;
width: 50%;
}
.modifybutton
{
clear: right;
float: right;
margin: 8px 20px 10px 0;
text-align: right;
}
tá ai o meu feedback que solucionei, pode dar como resolvido hehe..
o meu não teve alteração alguma :-[ alguém pode ver para mim !!
uso o tema gearbox
desde já .. agradeço