Quadro de dados

Detalhes da questão

Endereço do fórum: http://familywallker.forumeiros.com/
Versão do fórum: phpBB2

Descrição

Bom eu Quero o Meu Quadro de Dados desse Jeito »»» https://imgur.com/a/fiBDU No Nome "Pontos" Coloque Money e um Icon de Money, No Icone do Nome "Reputação" Coloque um Sinal de + dentro de uma Bolinha Verde,E no Quadro "Mensagens" Centraliza o Icone Dela.

Desde ja Obrigado <3

Olá,

Queira consultar este tópico:
 https://ajuda.forumeiros.com/t17049-

Até mais.
Fraise

Amigo não entendi Muito Bem,O Senhor Entendeu oque eu quero? Não Quero os Campos quero O Quadro ai e os Campos dentro dele,Como na Imagem Acima

Olá.

Quanto ao design, adicione à sua folha de estilo CSS o seguinte código:

Código:

.user-info .matd {
  border: 1px solid;
    border-left: 5px solid;
    background-color: #fff;
    font-size: 12px;
    padding: 3px;
    margin: 10px;
}

.user-info .matd .label {
    color: #000;
}

Já os icones atrás dos campos, você deseja uma imagem ou um icone do FontAwesome mesmo? Podemos fazer das duas formas.

Até o/

Sendo os Icon que eu Pedir,Pode ser em qualquer um ai,Oque o Senhor Achar mais Dahora pode por.Testei o Codigo la e deu Certo,Quando por o Icon o Nome vai ficar na Frente do Icone né? Como na Imagem Acima

É eu que Ponho os Icones ou o Senhor vai por?

Evite capitalizar as palavras em suas mensagens, fica difícil de compreender o que fala. Quanto ao código, o senhor implicitamente deverá fornecer os ícones, já que sem eles teremos retrabalho no futuro. Use a área de suporte de design, caso não possua as imagens.

As Imagens Aqui » https://imgur.com/a/6veR6 Elas são Pretas.

Adicione ao CSS:

Código:

.user-info > .matd {
    background-repeat: no-repeat;
    background-position: 5px center;
    background-size: 20px;
}

.user-info > .matd:nth-child(1) {
    background-image: url(http://i.imgur.com/ewknb4X.png);
}

.user-info > .matd:nth-child(2) {
    background-image: url(http://i.imgur.com/Jk1OJqi.png);
}

.user-info > .matd:nth-child(3) {
    background-image: url(http://i.imgur.com/S9LVDXg.png);
}

Ficou bom Amigo,Gostei <3
Obrigado a Todos <3 Todos voces que comentaram me ajudaram.