Arredondar botões e campos de texto

3 participantes

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

Tópico resolvido Arredondar botões e campos de texto

Mensagem por JonasB. 25.08.12 22:04

Qual é minha questão:
Como Arredondar os Botões e os Campos de Textos para ficar como a imagem

Links e imagens do meu problema:
Arredondar botões e campos de texto Lk10

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

Versão do meu fórum:
PHPBB3
JonasB.

JonasB.
*****

Membro desde : 30/07/2012
Mensagens : 481
Pontos : 638

http://suportedesign.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Arredondar botões e campos de texto

Mensagem por Convidado 25.08.12 23:09

Olá amigo,
adicione em sua folha de estilo:
Código:
.navbar {
background-color: transparent;
clear: both;
padding: 0 10px;
}
#wrap {
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 1px solid #FFFFFF;
}
.headerbar {
background-color: transparent;
background-image: none;
background-repeat: repeat-x;
margin-bottom: 4px;
padding: 0 5px;
}
.module {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border: 2px solid #5FADD4;
padding: 0;
}
div.panel.row3, div.post.row1, div.post.row1.online, div.post.row2, div.post.row2.online {
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
background-color: white;
border: solid 1px #D4D6D5;
border-radius: 7px;
padding: 2px;
}
.forabg {
background-color: #0076B1;
background-image: url(http://i49.servimg.com/u/f49/15/29/79/25/cat10.png);
background-position: 0 0;
background-repeat: repeat-x;
border: 2px solid white;
clear: both;
margin-bottom: 4px;
padding: 0 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 1px solid transparent;
}
#chatbox_members .member-title {
background-color: #FFFFFF;
background-image: none;
color : black;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 12px;
padding: .5em .25em;
text-align: center;
}
#chatbox_members {
  background-color: #FFFFFF;
}
#chatbox {
  background-color: #FFFFFF;
}
#divbold, #divcolor, #divitalic, #divsmilies, #divstrike, #divunderline, #main-content a.cgu-buttons, #message, .spoiler dt, button.button2, input#submit_button, input.button1, input.button2, input.liteoption, input.mainoption {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background: #F4F5F4 url(http://i66.servimg.com/u/f66/11/96/49/61/tabbg10.png);
border: solid 1px #DDD;
border-radius: 3px;
padding: 2px;
}
#divbold:hover, #divcolor, #divitalic:hover, #divsmilies:hover, #divstrike:hover, #divunderline:hover, #main-content a.cgu-buttons:hover, #message:hover, button.button2:hover, input#submit_button:hover, input.button1:hover, input.button2:hover, input.liteoption:hover, input.mainoption:hover {
background-position: 0 100%;
border: 1px solid #363636;
color: #363636;
}
.forabg {
background-color: #5FADD4;
background-image: url(http://i49.servimg.com/u/f49/15/29/79/25/cat10.png);
background-position: 0 0;
background-repeat: repeat-x;
border: 2px solid white;
clear: both;
margin-bottom: 4px;
padding: 0 5px;
}
li.row:hover dd {
border-left-color: transparent;
}
li.row dd{
border-left-color: transparent;

li.row {
border-bottom: 1px solid transparent; !important!
border-top: 1px solid transprent; !important!
}
li.row:hover {
background-color: #F0F0F0;
}
ul.forums {
background-color: #FFFFFF;
background-image: none;
}
.h3, h3 {
border-bottom: 1px solid #EFEFEF;
}
a:visited {
color: #666;
text-decoration: none;
}
a:link {
color: black;
text-decoration: none;
}
div.postprofile {
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
background-color: #EAEAEA;
border: solid 1px #D4D6D5;
border-radius: 7px;
left: 2px;
padding: 2px;
}
.postprofile {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border: 1px solid #EFEFEF;
padding: 15px 10px 10px 0;
text-align: center;
}
.postprofile {
border-color: gainsboro;
border-right-style: solid;
border-right-width: 1px;
color: #222;
display: inline;
float: left;
margin: 5px 0 0;
min-height: 80px;
position: relative;
width: 22%;
}
.postprofile dd, .postprofile dt {
line-height: 1.2em;
margin-left: 8px;
}
.spoiler {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background: #F4F5F4 url(http://i66.servimg.com/u/f66/11/96/49/61/tabbg10.png) repaeat-y;
border: solid 1px #DDD;
border-radius: 3px;
padding: 2px;
}
dl.codebox {
background-color: white;
border: 1px solid #C9D2D8;
font-size: 1em;
padding: 3px;
}
ul.profile-icons {
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-topright: 3px;
background-color: #EAEAEA;
border: solid 1px #D4D6D5;
border-bottom-left-radius: 10px;
border-top-right-radius: 3px;
height: 25px;
padding: 5px 5px 10px 10px !important;
position: relative;
right: -48px;
top: -18px;
}
.vote {
-moz-border-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
background-color: #EAEAEA;
border: 1px solid #D4D6D5;
padding: 4px 1px;
text-align: center;
width: 20px;
}
input.search {
background: url(http://2img.net/i/fa/sprite_prosilver_navbar.png) no-repeat top left;
background-position: 0 -701px;
padding-left: 17px;
}
.inputbox:hover {
border: 1px solid #EFEFEF;
}
.inputbox {
background-color: white;
border: 1px solid #BCBCBC;
color: #222;
cursor: text;
padding: 2px;
}
li.row {
background: #FFFFFF;
list-style-type: none;
}
Anonymous

Convidado
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Arredondar botões e campos de texto

Mensagem por JonasB. 25.08.12 23:21

Olá amigo, resultou, só que você adicionou CSS de seu fórum, que então não sei qual és o código de mudança.
JonasB.

JonasB.
*****

Membro desde : 30/07/2012
Mensagens : 481
Pontos : 638

http://suportedesign.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Arredondar botões e campos de texto

Mensagem por Dr.Helper 25.08.12 23:27

Olá,amigo !!!
Já leu este tutorial ?


Até mais !!!
Cordialmente LegionCheats !!!


Última edição por LegionCheats em 26.08.12 0:08, editado 1 vez(es)
Dr.Helper

Dr.Helper
Membro

Membro desde : 25/06/2012
Mensagens : 832
Pontos : 1231

http://ultra-pixel.forumeiros.com/ http://fb.com/DISTRICT.HACKERS https://twitter.com/@matheusvs100

Ir para o topo Ir para baixo

Tópico resolvido Re: Arredondar botões e campos de texto

Mensagem por JonasB. 25.08.12 23:37

LegionCheats escreveu:Olá,amigo !!!

Aceda á :

Painel de Controle :seta2: Visualização :seta2: Imagens&Cores :seta2: Cores Seta Folha de Estilo CSS

E adicione este código :

Código:
 .navbar {
background-color: transparent;
clear: both;
padding: 0 10px;
}
#wrap {
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 1px solid #FFFFFF;
}
.headerbar {
background-color: transparent;
background-image: none;
background-repeat: repeat-x;
margin-bottom: 4px;
padding: 0 5px;
}
.module {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border: 2px solid #5FADD4;
padding: 0;
}
div.panel.row3, div.post.row1, div.post.row1.online, div.post.row2, div.post.row2.online {
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
background-color: white;
border: solid 1px #D4D6D5;
border-radius: 7px;
padding: 2px;
}
.forabg {
background-color: #0076B1;
background-image: url(http://i49.servimg.com/u/f49/15/29/79/25/cat10.png);
background-position: 0 0;
background-repeat: repeat-x;
border: 2px solid white;
clear: both;
margin-bottom: 4px;
padding: 0 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 1px solid transparent;
}
#chatbox_members .member-title {
background-color: #FFFFFF;
background-image: none;
color : black;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 12px;
padding: .5em .25em;
text-align: center;
}
#chatbox_members {
  background-color: #FFFFFF;
}
#chatbox {
  background-color: #FFFFFF;
}
#divbold, #divcolor, #divitalic, #divsmilies, #divstrike, #divunderline, #main-content a.cgu-buttons, #message, .spoiler dt, button.button2, input#submit_button, input.button1, input.button2, input.liteoption, input.mainoption {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background: #F4F5F4 url(http://i66.servimg.com/u/f66/11/96/49/61/tabbg10.png);
border: solid 1px #DDD;
border-radius: 3px;
padding: 2px;
}
#divbold:hover, #divcolor, #divitalic:hover, #divsmilies:hover, #divstrike:hover, #divunderline:hover, #main-content a.cgu-buttons:hover, #message:hover, button.button2:hover, input#submit_button:hover, input.button1:hover, input.button2:hover, input.liteoption:hover, input.mainoption:hover {
background-position: 0 100%;
border: 1px solid #363636;
color: #363636;
}
.forabg {
background-color: #5FADD4;
background-image: url(http://i49.servimg.com/u/f49/15/29/79/25/cat10.png);
background-position: 0 0;
background-repeat: repeat-x;
border: 2px solid white;
clear: both;
margin-bottom: 4px;
padding: 0 5px;
}
li.row:hover dd {
border-left-color: transparent;
}
li.row dd{
border-left-color: transparent;

li.row {
border-bottom: 1px solid transparent; !important!
border-top: 1px solid transprent; !important!
}
li.row:hover {
background-color: #F0F0F0;
}
ul.forums {
background-color: #FFFFFF;
background-image: none;
}
.h3, h3 {
border-bottom: 1px solid #EFEFEF;
}
a:visited {
color: #666;
text-decoration: none;
}
a:link {
color: black;
text-decoration: none;
}
div.postprofile {
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
background-color: #EAEAEA;
border: solid 1px #D4D6D5;
border-radius: 7px;
left: 2px;
padding: 2px;
}
.postprofile {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border: 1px solid #EFEFEF;
padding: 15px 10px 10px 0;
text-align: center;
}
.postprofile {
border-color: gainsboro;
border-right-style: solid;
border-right-width: 1px;
color: #222;
display: inline;
float: left;
margin: 5px 0 0;
min-height: 80px;
position: relative;
width: 22%;
}
.postprofile dd, .postprofile dt {
line-height: 1.2em;
margin-left: 8px;
}
.spoiler {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background: #F4F5F4 url(http://i66.servimg.com/u/f66/11/96/49/61/tabbg10.png) repaeat-y;
border: solid 1px #DDD;
border-radius: 3px;
padding: 2px;
}
dl.codebox {
background-color: white;
border: 1px solid #C9D2D8;
font-size: 1em;
padding: 3px;
}
ul.profile-icons {
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-topright: 3px;
background-color: #EAEAEA;
border: solid 1px #D4D6D5;
border-bottom-left-radius: 10px;
border-top-right-radius: 3px;
height: 25px;
padding: 5px 5px 10px 10px !important;
position: relative;
right: -48px;
top: -18px;
}
.vote {
-moz-border-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
background-color: #EAEAEA;
border: 1px solid #D4D6D5;
padding: 4px 1px;
text-align: center;
width: 20px;
}
input.search {
background: url(http://2img.net/i/fa/sprite_prosilver_navbar.png) no-repeat top left;
background-position: 0 -701px;
padding-left: 17px;
}
.inputbox:hover {
border: 1px solid #EFEFEF;
}
.inputbox {
background-color: white;
border: 1px solid #BCBCBC;
color: #222;
cursor: text;
padding: 2px;
}
li.row {
background: #FFFFFF;
list-style-type: none;
}

Até mais !!!
Cordialmente LegionCheats !!!
Amigo, você somente copiou o código citado pelo -FireWhip-.
JonasB.

JonasB.
*****

Membro desde : 30/07/2012
Mensagens : 481
Pontos : 638

http://suportedesign.forumeiros.com/

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Arredondar botões e campos de texto

Mensagem por Sennior 26.08.12 0:47

Olá autor.

Coloque o código abaixo em seu CSS:

.inputbox {
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border: 1px solid #000000;
}

Atenciosamente. Piscada
Sennior

Sennior
Principal Contribuidor
Principal Contribuidor

Membro desde : 10/06/2011
Mensagens : 16379
Pontos : 20903

https://ajuda.forumeiros.com/forum https://www.facebook.com/GladstonHenriq https://twitter.com/UmGladston

Ir para o topo Ir para baixo

Tópico resolvido Re: Arredondar botões e campos de texto

Mensagem por JonasB. 26.08.12 1:13

Olá, Não Resultou.
JonasB.

JonasB.
*****

Membro desde : 30/07/2012
Mensagens : 481
Pontos : 638

http://suportedesign.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Arredondar botões e campos de texto

Mensagem por Convidado 26.08.12 2:07

Brasil Zeon escreveu:Olá amigo, resultou, só que você adicionou CSS de seu fórum, que então não sei qual és o código de mudança.
Amigo não entendi o que quis dizer com isto poderia explicar melhor?
Anonymous

Convidado
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Arredondar botões e campos de texto

Mensagem por JonasB. 26.08.12 2:09

Está com códigos além do que eu quero, gostaria somente do meu desejado.
JonasB.

JonasB.
*****

Membro desde : 30/07/2012
Mensagens : 481
Pontos : 638

http://suportedesign.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Arredondar botões e campos de texto

Mensagem por Convidado 26.08.12 2:14

Olá amigo,
é que é muito código vai tentando por em poucos até que funcione somente no que deseja.
Anonymous

Convidado
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Arredondar botões e campos de texto

Mensagem por JonasB. 26.08.12 2:27

O código foi este:
Código:
#divbold, #divcolor, #divitalic, #divsmilies, #divstrike, #divunderline, #main-content a.cgu-buttons, #message, .spoiler dt, button.button2, input#submit_button, input.button1, input.button2, input.liteoption, input.mainoption {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background: #F4F5F4 url(http://i66.servimg.com/u/f66/11/96/49/61/tabbg10.png);
border: solid 1px #DDD;
border-radius: 3px;
padding: 2px;
}
#divbold:hover, #divcolor, #divitalic:hover, #divsmilies:hover, #divstrike:hover, #divunderline:hover, #main-content a.cgu-buttons:hover, #message:hover, button.button2:hover, input#submit_button:hover, input.button1:hover, input.button2:hover, input.liteoption:hover, input.mainoption:hover {
background-position: 0 100%;
border: 1px solid #363636;
color: #363636;
}
dl.codebox {
background-color: white;
border: 1px solid #C9D2D8;
font-size: 1em;
padding: 3px;
}
.vote {
-moz-border-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
border-radius: 10px;
background-color: #EAEAEA;
border: 1px solid #D4D6D5;
padding: 4px 1px;
text-align: center;
width: 20px;
}
input.search {
background: url(http://2img.net/i/fa/sprite_prosilver_navbar.png) no-repeat top left;
background-position: 0 -701px;
padding-left: 17px;
}
.inputbox:hover {
border: 1px solid #EFEFEF;
}
.inputbox {
background-color: white;
border: 1px solid #BCBCBC;
border-radius: 10px;
color: #222;
cursor: text;
padding: 2px;
}

Resolvido.

até mais.
JonasB.

JonasB.
*****

Membro desde : 30/07/2012
Mensagens : 481
Pontos : 638

http://suportedesign.forumeiros.com/

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos