Icone dentro da caixa de login e senha

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

Resolvido Icone dentro da caixa de login e senha

Mensagem por AlfaBeta. em 15/07/13, 10:59 pm

Qual é minha questão:
Olá, pessoal.

Gostaria de saber se é possivel colocar os mesmo icones dentro da caixa de login e senha, como nesse tema:
http://pt.hitskin.com/buscar-um-tema/cmyk-br-design-198198.htm

Agradeço.

Endereço do meu fórum:
http://carrosegames.forumeiros.com

Versão do fórum:
PHPBB3


Última edição por AlfaBeta. em 16/07/13, 01:03 am, editado 1 vez(es)
avatar

AlfaBeta.
Nível 9

Masculino
Inscrito dia : 12/07/2013
Mensagens : 208
Pontos Ativos : 342

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

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por Hizu em 15/07/13, 11:01 pm

Saudações!

Aceda à sua "Folha de estilo CSS":
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores Seta Folha de estilo CSS


Adicione este código no inicio ou no final da tua CSS:
Código:
#username {
background: #fff url(http://i.imgur.com/rzOu1.png)no-repeat;
border: 1px solid #DDD;
border-radius: 0!important;
cursor: text;
padding: 5px 5px 5px 20px;
top: 0;
}
#password {
background: #fff url(http://i.imgur.com/dlS8w.png)no-repeat;
border: 1px solid #DDD;
border-radius: 0!important;
cursor: text;
padding: 5px 5px 5px 20px;
top: 0;
}
.user_login_form input[type="text"] {
background: url(http://i.imgur.com/rzOu1.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"] {
background: #fff url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}

Flecha ajudeiros Feito isto, salve!

Atenciosamente,
Hizu. Piscada

Hizu
Nível 9

Masculino
Inscrito dia : 08/07/2013
Mensagens : 249
Pontos Ativos : 360

Ver perfil do usuário

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por AlfaBeta. em 15/07/13, 11:21 pm

Otimo. Embora os icones estão um pouco mais pra baixo, não centralizados.
Há como mexermos nisso?
avatar

AlfaBeta.
Nível 9

Masculino
Inscrito dia : 12/07/2013
Mensagens : 208
Pontos Ativos : 342

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

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por Hizu em 15/07/13, 11:26 pm

Saudações!

Substitua o código anterior por este:
Código:
#username {
background: #fff url(http://i.imgur.com/rzOu1.png)no-repeat;
border: 1px solid #DDD;
border-radius: 0!important;
cursor: text;
padding: 5px 5px 5px 20px;
top: 0;
}
#password {
background: #fff url(http://i.imgur.com/dlS8w.png)no-repeat;
border: 1px solid #DDD;
border-radius: 0!important;
cursor: text;
padding: 5px 5px 5px 20px;
top: 0;
}
.user_login_form input[type="text"] {
background: url(http://i.imgur.com/rzOu1.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"] {
background: #fff url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"], .user_login_form input[type="text"] {
position: relative;
top: 7px;
}

Flecha ajudeiros Feito isto, salve!

Atenciosamente,
Hizu. Piscada

Hizu
Nível 9

Masculino
Inscrito dia : 08/07/2013
Mensagens : 249
Pontos Ativos : 360

Ver perfil do usuário

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por North em 15/07/13, 11:28 pm

Boa noite,

Caso não resolva, experimente este:

Código:
#username {
background: #fff url(http://i.imgur.com/rzOu1.png)no-repeat;
border: 1px solid #DDD;
border-radius: 0!important;
cursor: text;
padding: 4px;
top: 10px;
}
#password {
background: #fff url(http://i.imgur.com/dlS8w.png)no-repeat;
border: 1px solid #DDD;
border-radius: 0!important;
cursor: text;
padding: 4px;
top: 0;
}

Até mais!


North aconselha:
Artmeiros  Respeite as Regras do fórum e conheça a nossa equipe staff.
Artmeiros  Esteja atento as Regras do setor gráfico.
Artmeiros  Salve as imagens em seu computador, pois poderão ser removidas do servidor em um possível backup.
Artmeiros  Mensagens Privadas apenas para assuntos importantes!

avatar

North
Publicideiro
Publicideiro

Masculino
Inscrito dia : 07/06/2011
Mensagens : 3837
Pontos Ativos : 5039

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

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por AlfaBeta. em 15/07/13, 11:50 pm

Bem, deu na mesma os codigos. Apenas movem a caixa, não a imagem dentro.
avatar

AlfaBeta.
Nível 9

Masculino
Inscrito dia : 12/07/2013
Mensagens : 208
Pontos Ativos : 342

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

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por Hizu em 15/07/13, 11:55 pm

Saudações!

Este funcionará!

Substitua o código atual por este:
Código:
.user_login_form input[type="password"], .user_login_form input[type="text"] {
border: 1px solid #DDD;
padding: 5px;
border-radius: 0px!important;
cursor: text;
top: 0px;
}
.user_login_form input[type="text"] {
background: url(http://i.imgur.com/rzOu1.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"] {
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
#username {
border: 1px solid #DDD;
padding: 5px;
border-radius: 0px!important;
cursor: text;
top: 0px;
padding-left: 20px;
background: white url(http://i.imgur.com/rzOu1.png)no-repeat;
}
#password {
border: 1px solid #DDD;
padding: 5px;
border-radius: 0px!important;
cursor: text;
top: 0px;
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}

Atenciosamente,
Hizu. Piscada

Hizu
Nível 9

Masculino
Inscrito dia : 08/07/2013
Mensagens : 249
Pontos Ativos : 360

Ver perfil do usuário

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por AlfaBeta. em 16/07/13, 12:01 am

Bacana. Realmente moveu o icone, mas foi mudada a caixa. Agora é quadrada. Gostaria que continuasse como estava..arredondada.
avatar

AlfaBeta.
Nível 9

Masculino
Inscrito dia : 12/07/2013
Mensagens : 208
Pontos Ativos : 342

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

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por Hizu em 16/07/13, 12:04 am

Saudações!

Neste caso, substitua o código atual por este:
Código:
.user_login_form input[type="password"], .user_login_form input[type="text"] {
border: 1px solid #DDD;
padding: 5px;
border-radius: 0px!important;
cursor: text;
top: 0px;
}
.user_login_form input[type="text"] {
background: url(http://i.imgur.com/rzOu1.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"] {
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
#username {
border: 1px solid #DDD;
padding: 5px;
border-radius: 0px!important;
cursor: text;
top: 0px;
padding-left: 20px;
background: white url(http://i.imgur.com/rzOu1.png)no-repeat;
}
#password {
border: 1px solid #DDD;
padding: 5px;
border-radius: 0px!important;
cursor: text;
top: 0px;
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}

Flecha ajudeiros Procure por "border-radius: 0px!important;" e aumente o valor "0" até ficar ao teu gosto!

Atenciosamente,
Hizu. Piscada

Hizu
Nível 9

Masculino
Inscrito dia : 08/07/2013
Mensagens : 249
Pontos Ativos : 360

Ver perfil do usuário

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por AlfaBeta. em 16/07/13, 12:11 am

Muito bom.
Mas a caixa agora está mais 'gorda'. Gostaria de manter a finura do original.

Segue o codigo:
Código:
.user_login_form input[type="password"], .user_login_form input[type="text"] {
border: 1px solid #DDD;
padding: 5px;
border-radius: 20px!important;
cursor: text;
top: 0px;
}
.user_login_form input[type="text"] {
background: url(http://i.imgur.com/rzOu1.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"] {
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
#username {
border: 1px solid #DDD;
padding: 5px;
border-radius: 20px!important;
cursor: text;
top: 0px;
padding-left: 20px;
background: white url(http://i.imgur.com/rzOu1.png)no-repeat;
}
#password {
border: 1px solid #DDD;
padding: 5px;
border-radius: 20px!important;
cursor: text;
top: 0px;
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
avatar

AlfaBeta.
Nível 9

Masculino
Inscrito dia : 12/07/2013
Mensagens : 208
Pontos Ativos : 342

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

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por Hizu em 16/07/13, 12:14 am

Olá!

Basta substituir por um destes códigos abaixo:
Código:
.user_login_form input[type="password"], .user_login_form input[type="text"] {
border: 1px solid #DDD;
padding: 5px;
border-radius: 20px!important;
cursor: text;
top: 0px;
}
.user_login_form input[type="text"] {
background: url(http://i.imgur.com/rzOu1.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"] {
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
#username {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
padding-left: 20px;
background: white url(http://i.imgur.com/rzOu1.png)no-repeat;
}
#password {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}

No caso do código acima não funcionar, substitua por este:
Código:
.user_login_form input[type="password"], .user_login_form input[type="text"] {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
}
.user_login_form input[type="text"] {
background: url(http://i.imgur.com/rzOu1.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"] {
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
#username {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
padding-left: 20px;
background: white url(http://i.imgur.com/rzOu1.png)no-repeat;
}
#password {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}

Atenciosamente,
Hizu. Piscada

Hizu
Nível 9

Masculino
Inscrito dia : 08/07/2013
Mensagens : 249
Pontos Ativos : 360

Ver perfil do usuário

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por AlfaBeta. em 16/07/13, 12:18 am

Continuou como antes. Tendo o arredodando que 'arrumei', mas nao tendo a finura do original.
avatar

AlfaBeta.
Nível 9

Masculino
Inscrito dia : 12/07/2013
Mensagens : 208
Pontos Ativos : 342

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

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por Hizu em 16/07/13, 12:28 am

Estranho... Louco 
Este código funcionou perfeitamente em meu fórum de testes:
Código:
.user_login_form input[type="password"], .user_login_form input[type="text"] {
border: 1px solid #DDD;
padding: 5px;
border-radius: 20px!important;
cursor: text;
top: 0px;
}
.user_login_form input[type="text"] {
background: white url(http://i.imgur.com/rzOu1.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"] {
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
#username {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
padding-left: 20px;
background: white url(http://i.imgur.com/rzOu1.png)no-repeat;
}
#password {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}

Creio que o senhor deixou algum outro código antigo relacionado à isto na tua CSS e por isto não está surtindo efeito!

Atenciosamente.

Hizu
Nível 9

Masculino
Inscrito dia : 08/07/2013
Mensagens : 249
Pontos Ativos : 360

Ver perfil do usuário

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por AlfaBeta. em 16/07/13, 12:35 am

Pois é.
Mando imagem de como ficou aqui.

Na primeira... era como eu queria...mas com os icones um pouco pra cima. E a segunda é como está agora...espaço mais 'gordo'.

http://i34.servimg.com/u/f34/18/40/06/56/imagem20.jpg


Segue meu codigo:
Código:
/* ---------- Titulos da Categoria: Alinhamento - ULTIMA MENSAGEM -------------------- */
li.header dd.lastpost {display: block !important;padding-left: 25px !important;}
/* ---------- Caixa de Login e Senha: insercao de icones ----------------------------- */
.user_login_form input[type="password"], .user_login_form input[type="text"] {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
}
.user_login_form input[type="text"] {
background: url(http://i.imgur.com/rzOu1.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"] {
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
#username {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
padding-left: 20px;
background: white url(http://i.imgur.com/rzOu1.png)no-repeat;
}
#password {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
/* ---------- Perfil nos Topicos: Contorno e Preenchimento --------------------------- */
.postprofile {
border: 1px solid rgba(82, 82, 82, 0.51) !important;
border-radius: 10px;
background: rgba(189, 196, 199, 0.14);
}
/* ---------- Alinhamento de Texto/Caixa nos Botoes ---------------------------------- */
fieldset.submit-buttons input {
margin-top: -1px !important;
padding-bottom: 2px;
padding-top: 2px;
padding: 2px 8px;
font-family: trebuchet MS,trebuchet MS;
overflow: visible;
vertical-align: middle;
}
/* ---------- Alinhamento de Titulo nos Topicos -------------------------------------- */
.author, p.author, .postbody .topic-title {
position: relative !important;
margin-left: -7px !important;
}
.topic-title, .author, p.author {
position: relative !important;
margin-left: -3px !important;
}
/* ---------- Ultimo mensagem: mostrar foto - precisa ativar JAVA -------------------- */
 .mini_ava {
 float: left;
 }

 .mini_ava img {
width: 24px;
height: 27px;
margin: 0 5px;
padding: 1px;
border: 1px solid #D5D5D5;
background: white;
 -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
 -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
 }

 .mini_ava img:hover {
border-color: #a1a1a1;
 -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
 -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
 }
/* ------------ Barra de rolagem Google Chrome --------------------------------------- */
::-webkit-scrollbar {
width: 15px;
height: 5px;
}
::-webkit-scrollbar-track-piece {
background: #e0dcd5;
}
::-webkit-scrollbar-thumb:vertical {
height: 5px;
background: #000;
border-radius: 5px;
}
::-webkit-scrollbar-thumb:horizontal {
width: 5px;
background-color: #948f87;
}
/* ------------ Caixas de Busca ------------------------------------------------------ */
#search_keywords {
margin-top: -2px !important
}
#search_keywords, #keywords {
-moz-box-sizing: content-box;
background: none repeat scroll 0 0 #FFF;
border: 1px solid #D9D9D9;
border-radius: 4px 4px 4px 4px;
color: #000;
height: 19px;
background-color: #FFF;
border: 1px solid #CCC;
border-radius: 3px 3px 3px 3px;
box-shadow: 0 1px 3px rgba(0,0,0,0.1) inset;
color: #515151;
cursor: text;
display: inline-block;
font-size: 13px;
line-height: 18px;
outline: 0 none;
padding: 4px;
}
#search_keywords:hover, #keywords:hover {
transition: all 1s ease-in-out 0;
width: 150px;
border: 1px solid #000;
}
.button2, .nomargin .button2 {
background-color: #F5F5F5;
border: 1px solid rgba(0,0,0,0.1);
border-radius: 3px 3px 3px 3px;
color: #666;
cursor: pointer;
font-size: 11px;
font-weight: 700;
height: 27px;
line-height: 25px;
min-width: 50px;
padding: 0 8px;
text-align: center;
}
#search-box input.button2, .nomargin .button2 {
    background-color: #F5F5F5;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 2px 2px 2px 2px;
    color: #666666;
    cursor: pointer;
    font-size: 11px;
    font-weight: 700;
    height: 29px;
    line-height: 29px;
    margin: 11px 6px 11px;
    min-width: 54px;
    padding: 0 8px;
    text-align: center;
}
#search-box {
    float: right;
    margin-right: 5px;
    margin-top: -7px;
    white-space: nowrap;
}
#search #keywords:focus {
    width: 290px;
}
#search #keywords {
    transition: all 1s ease-in-out 0s;
    width: 150px;
}
#search-box #keywords {
    background-color: #FFFFFF;
    width: 110px;
}
#search-box input {
    -moz-box-sizing: content-box;
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #D9D9D9;
    border-radius: 4px 4px 4px 4px;
    color: #000000;
    height: 23px;
}

.conteneur_container_IE{position: relative;bottom: -3px;margin-top: -2px;padding: 1px;}
/* ------------ Widgets: Distancia em relacao ao topo --------------------------------- */
#right,#left{margin-top:48px}
/* ------------ Widgets: Tamanho Fonte ------------------------------------------------ */
.module{
font-size: 12.5px !important;
}
/* ------------ Botoes Reputacao: Posicao --------------------------------------------- */
.vote {
margin-top: 360px !important;
}
/* ------------ Botoes Reputacao: Modificacao ----------------------------------------- */
.vote-button {
position: relative !important;
left: 3px !important;
top: 2px !important;
}
.vote {
padding: 4px 1px 4px 1px;
text-align: center;
width:20px;
background-color: #eaeaea;
border: 1px solid #d4d6d5;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-top-left-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
}

.vote .vote-no-bar {
display: none;
}

.vote .vote-bar {
border-left: 0px;
border-right: 0px;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #d4d6d5;
font-size: 0px;
height: 50px;
margin: 0px;
width: 20px;
padding: 3px 0px 3px 0px;
}

.vote .vote-bar-plus {
margin-left: 7px;
width: 6px;
}

.vote .vote-bar-minus {
margin-left: 7px;
width: 6px;
top: -60 !important;
}

.vote .vote-button a[href*="plus"] {
background: url('http://i27.servimg.com/u/f27/15/17/71/53/add1010.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}

.vote .vote-button a[href*="minus"] {
background-image: url('http://i27.servimg.com/u/f27/15/17/71/53/delete10.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
top: -60 !important;
}
/* ------------ Caixa dos Perfis nos Topicos: Largura -------------------------------- */
.postprofile {width: 245px;}
/* ------------ Texto dos Perfis nos Topicos: Alinhamento a esquerda ----------------- */
div.postprofile dl dd{text-align:left;}
dl dd img {margin-left:2px;}
div.postprofile dl dt{margin-right:42px;}
span.Líder b {margin-left:15px;}
/* ------------ Caixa em Relevo unica em volta do Avatar nos Topicos ------------------ */
.postprofile dt img {
background: none repeat scroll 0 0 #FFF;
border-radius: 10px 10px 10px 10px;
box-shadow: 0 1px 30px rgba(0,0,0,0.27), 0 0 30px rgba(0,0,0,0.1) inset;
margin-bottom: -2;
max-height: 300px!important;
max-width: 150px!important;
padding: 9px 9px;
}
.postprofile dt img:hover {
background-color: #e8eaff;
box-shadow: 0 0 3px #AAA inset;
cursor: pointer;
text-decoration: none;
}
/* ------------ Titulos em Neon: Retirada do Sublinhado ------------------------------ */
a:hover{text-decoration:none!important}
/* ------------ Fonte dos Grupos no rodape: Estilo ----------------------------------- */
em {
font-style: normal;
}
/* ------------ Codigo Padrao -------------------------------------------------------- */
.topics {
border: none !important;
}
.lastpost {
border: none !important;
}
.posts {
border: none !important;
}
#picture_legend {
background-color: #a3a3a3;
border: 2px solid #B5B5B5;
border-radius: 3px 3px 3px 3px;
width: 500px;
margin-left: 30%;
}
#picture_legend img{
opacity: 0.5;
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
#picture_legend img:hover{
opacity: 1;
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
#i_whosonline.img-whois {
margin-left: -5px;
}
#tabs .activetab a {
background-color: #B5B5B5;
background-position: 0 0;
border-bottom: 1px solid #B5B5B5;
margin-bottom: -1px;
color: #000000;
}
#tabs a {
-moz-border-radius: 4px 4px 0 0;
-o-border-radius: 4px 4px 0 0;
-webkit-border-radius: 4px 4px 0 0;
background-color: #B5B5B5;
border-radius: 4px 4px 0 0;
margin: 0 2px;
}
.linklist.navlinks {
border: none;
}
ul.linklist li a img {
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
opacity: 0.5;
}
ul.linklist li a img:hover {
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
opacity: 1;
}
forabg {
border-radius: 50px 50px 50px 50px;
}
a:hover {
text-shadow: 0px 0px 5px;
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
a {
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
li.row:hover {
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
li.row {
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
.navbar {
font-size: 16px;
background-color: transparent;
}
#wrap {
border: 2px solid #A3A3A3;
border-radius: 10px 10px 10px 10px;
}
.headerbar {
background-color: transparent;
}
.forabg {
border-radius: 10px 10px 10px 10px;
}
.forumbg {
border-radius: 10px 10px 10px 10px;
}
.post {
border: 2px solid #A3A3A3;
border-radius: 10px 10px 10px 10px;
}
.postprofile {
border-right: none;
text-align: center;
}
#tabs {
border-radius: 10px 10px 10px 10px;
}
avatar

AlfaBeta.
Nível 9

Masculino
Inscrito dia : 12/07/2013
Mensagens : 208
Pontos Ativos : 342

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

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por Hizu em 16/07/13, 12:45 am

Saudações!

Substitua a tua CSS por está:
Código:
/* ---------- Titulos da Categoria: Alinhamento - ULTIMA MENSAGEM -------------------- */
li.header dd.lastpost {display: block !important;padding-left: 25px !important;}
/* ---------- Caixa de Login e Senha: insercao de icones ----------------------------- */
.user_login_form input[type="password"], .user_login_form input[type="text"] {
border: 1px solid #DDD;
padding: 5px;
border-radius: 20px!important;
cursor: text;
top: 0px;
}
.user_login_form input[type="text"] {
background: white url(http://i.imgur.com/rzOu1.png)no-repeat;
padding-left: 20px;
}
.user_login_form input[type="password"] {
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
#username {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
padding-left: 20px;
background: white url(http://i.imgur.com/rzOu1.png)no-repeat;
}
#password {
border: 1px solid #DDD;
padding: 5px 5px 5px 20px;
border-radius: 20px!important;
cursor: text;
top: 0px;
background: white url(http://i.imgur.com/dlS8w.png)no-repeat;
padding-left: 20px;
}
/* ---------- Perfil nos Topicos: Contorno e Preenchimento --------------------------- */
.postprofile {
border: 1px solid rgba(82, 82, 82, 0.51) !important;
border-radius: 10px;
background: rgba(189, 196, 199, 0.14);
}
/* ---------- Alinhamento de Texto/Caixa nos Botoes ---------------------------------- */
fieldset.submit-buttons input {
margin-top: -1px !important;
padding-bottom: 2px;
padding-top: 2px;
padding: 2px 8px;
font-family: trebuchet MS,trebuchet MS;
overflow: visible;
vertical-align: middle;
}
/* ---------- Alinhamento de Titulo nos Topicos -------------------------------------- */
.author, p.author, .postbody .topic-title {
position: relative !important;
margin-left: -7px !important;
}
.topic-title, .author, p.author {
position: relative !important;
margin-left: -3px !important;
}
/* ---------- Ultimo mensagem: mostrar foto - precisa ativar JAVA -------------------- */
 .mini_ava {
 float: left;
 }

 .mini_ava img {
width: 24px;
height: 27px;
margin: 0 5px;
padding: 1px;
border: 1px solid #D5D5D5;
background: white;
 -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
 -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
 }

 .mini_ava img:hover {
border-color: #a1a1a1;
 -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
 -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
 }
/* ------------ Barra de rolagem Google Chrome --------------------------------------- */
::-webkit-scrollbar {
width: 15px;
height: 5px;
}
::-webkit-scrollbar-track-piece {
background: #e0dcd5;
}
::-webkit-scrollbar-thumb:vertical {
height: 5px;
background: #000;
border-radius: 5px;
}
::-webkit-scrollbar-thumb:horizontal {
width: 5px;
background-color: #948f87;
}
/* ------------ Caixas de Busca ------------------------------------------------------ */
#search_keywords {
margin-top: -2px !important
}
#search_keywords, #keywords {
-moz-box-sizing: content-box;
background: none repeat scroll 0 0 #FFF;
border: 1px solid #D9D9D9;
border-radius: 4px 4px 4px 4px;
color: #000;
height: 19px;
background-color: #FFF;
border: 1px solid #CCC;
border-radius: 3px 3px 3px 3px;
box-shadow: 0 1px 3px rgba(0,0,0,0.1) inset;
color: #515151;
cursor: text;
display: inline-block;
font-size: 13px;
line-height: 18px;
outline: 0 none;
padding: 4px;
}
#search_keywords:hover, #keywords:hover {
transition: all 1s ease-in-out 0;
width: 150px;
border: 1px solid #000;
}
.button2, .nomargin .button2 {
background-color: #F5F5F5;
border: 1px solid rgba(0,0,0,0.1);
border-radius: 3px 3px 3px 3px;
color: #666;
cursor: pointer;
font-size: 11px;
font-weight: 700;
height: 27px;
line-height: 25px;
min-width: 50px;
padding: 0 8px;
text-align: center;
}
#search-box input.button2, .nomargin .button2 {
    background-color: #F5F5F5;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 2px 2px 2px 2px;
    color: #666666;
    cursor: pointer;
    font-size: 11px;
    font-weight: 700;
    height: 29px;
    line-height: 29px;
    margin: 11px 6px 11px;
    min-width: 54px;
    padding: 0 8px;
    text-align: center;
}
#search-box {
    float: right;
    margin-right: 5px;
    margin-top: -7px;
    white-space: nowrap;
}
#search #keywords:focus {
    width: 290px;
}
#search #keywords {
    transition: all 1s ease-in-out 0s;
    width: 150px;
}
#search-box #keywords {
    background-color: #FFFFFF;
    width: 110px;
}
#search-box input {
    -moz-box-sizing: content-box;
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #D9D9D9;
    border-radius: 4px 4px 4px 4px;
    color: #000000;
    height: 23px;
}

.conteneur_container_IE{position: relative;bottom: -3px;margin-top: -2px;padding: 1px;}
/* ------------ Widgets: Distancia em relacao ao topo --------------------------------- */
#right,#left{margin-top:48px}
/* ------------ Widgets: Tamanho Fonte ------------------------------------------------ */
.module{
font-size: 12.5px !important;
}
/* ------------ Botoes Reputacao: Posicao --------------------------------------------- */
.vote {
margin-top: 360px !important;
}
/* ------------ Botoes Reputacao: Modificacao ----------------------------------------- */
.vote-button {
position: relative !important;
left: 3px !important;
top: 2px !important;
}
.vote {
padding: 4px 1px 4px 1px;
text-align: center;
width:20px;
background-color: #eaeaea;
border: 1px solid #d4d6d5;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-top-left-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
}

.vote .vote-no-bar {
display: none;
}

.vote .vote-bar {
border-left: 0px;
border-right: 0px;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #d4d6d5;
font-size: 0px;
height: 50px;
margin: 0px;
width: 20px;
padding: 3px 0px 3px 0px;
}

.vote .vote-bar-plus {
margin-left: 7px;
width: 6px;
}

.vote .vote-bar-minus {
margin-left: 7px;
width: 6px;
top: -60 !important;
}

.vote .vote-button a[href*="plus"] {
background: url('http://i27.servimg.com/u/f27/15/17/71/53/add1010.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}

.vote .vote-button a[href*="minus"] {
background-image: url('http://i27.servimg.com/u/f27/15/17/71/53/delete10.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
top: -60 !important;
}
/* ------------ Caixa dos Perfis nos Topicos: Largura -------------------------------- */
.postprofile {width: 245px;}
/* ------------ Texto dos Perfis nos Topicos: Alinhamento a esquerda ----------------- */
div.postprofile dl dd{text-align:left;}
dl dd img {margin-left:2px;}
div.postprofile dl dt{margin-right:42px;}
span.Líder b {margin-left:15px;}
/* ------------ Caixa em Relevo unica em volta do Avatar nos Topicos ------------------ */
.postprofile dt img {
background: none repeat scroll 0 0 #FFF;
border-radius: 10px 10px 10px 10px;
box-shadow: 0 1px 30px rgba(0,0,0,0.27), 0 0 30px rgba(0,0,0,0.1) inset;
margin-bottom: -2;
max-height: 300px!important;
max-width: 150px!important;
padding: 9px 9px;
}
.postprofile dt img:hover {
background-color: #e8eaff;
box-shadow: 0 0 3px #AAA inset;
cursor: pointer;
text-decoration: none;
}
/* ------------ Titulos em Neon: Retirada do Sublinhado ------------------------------ */
a:hover{text-decoration:none!important}
/* ------------ Fonte dos Grupos no rodape: Estilo ----------------------------------- */
em {
font-style: normal;
}
/* ------------ Codigo Padrao -------------------------------------------------------- */
.topics {
border: none !important;
}
.lastpost {
border: none !important;
}
.posts {
border: none !important;
}
#picture_legend {
background-color: #a3a3a3;
border: 2px solid #B5B5B5;
border-radius: 3px 3px 3px 3px;
width: 500px;
margin-left: 30%;
}
#picture_legend img{
opacity: 0.5;
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
#picture_legend img:hover{
opacity: 1;
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
#i_whosonline.img-whois {
margin-left: -5px;
}
#tabs .activetab a {
background-color: #B5B5B5;
background-position: 0 0;
border-bottom: 1px solid #B5B5B5;
margin-bottom: -1px;
color: #000000;
}
#tabs a {
-moz-border-radius: 4px 4px 0 0;
-o-border-radius: 4px 4px 0 0;
-webkit-border-radius: 4px 4px 0 0;
background-color: #B5B5B5;
border-radius: 4px 4px 0 0;
margin: 0 2px;
}
.linklist.navlinks {
border: none;
}
ul.linklist li a img {
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
opacity: 0.5;
}
ul.linklist li a img:hover {
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
opacity: 1;
}
forabg {
border-radius: 50px 50px 50px 50px;
}
a:hover {
text-shadow: 0px 0px 5px;
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
a {
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
li.row:hover {
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
li.row {
-moz-transition: all .3s linear;
-webkit-transition: all .3s linear;
}
.navbar {
font-size: 16px;
background-color: transparent;
}
#wrap {
border: 2px solid #A3A3A3;
border-radius: 10px 10px 10px 10px;
}
.headerbar {
background-color: transparent;
}
.forabg {
border-radius: 10px 10px 10px 10px;
}
.forumbg {
border-radius: 10px 10px 10px 10px;
}
.post {
border: 2px solid #A3A3A3;
border-radius: 10px 10px 10px 10px;
}
.postprofile {
border-right: none;
text-align: center;
}
#tabs {
border-radius: 10px 10px 10px 10px;
}

Atenciosamente,
Hizu. Piscada

Hizu
Nível 9

Masculino
Inscrito dia : 08/07/2013
Mensagens : 249
Pontos Ativos : 360

Ver perfil do usuário

Resolvido Re: Icone dentro da caixa de login e senha

Mensagem por AlfaBeta. em 16/07/13, 01:02 am

Opa. Otimo.
Dou como resolvido.

Muito obrigado.
avatar

AlfaBeta.
Nível 9

Masculino
Inscrito dia : 12/07/2013
Mensagens : 208
Pontos Ativos : 342

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

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


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