-
Conteúdo Similar
-
Por tabl
<style> body, input, textarea { font: 12px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; background-color: #FAFAFA; color: #656565; } .pricing-table { display: inline-block; margin-top: 20px; margin-bottom: 0; width: 100%; } .layers { box-shadow: 0 1px 1px rgba(0, 0, 0, 0),0 8px 0 -5px #FCFCFC,0 8px 1px -4px rgba(0, 0, 0, 0.15),0 17px 0 -10px #FCFCFC,0 17px 1px -9px rgba(0, 0, 0, 0.15); } .clearfix:after, .clearfix:before { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } [class *="col-"] { margin: 0; position: relative; margin-right: 30px; margin-bottom: 20px; float: left; } .col-3 { width: 210px; } .plan-item { position: relative; overflow: hidden; border: 1px solid #E2E1E0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; text-align: center; background-color: #FFF; -webkit-transition: all .2s linear; -moz-transition: all .2s linear; -o-transition: all .2s linear; -ms-transition: all .2s linear; transition: all .2s linear; background-image: url(http://hbzone.hbthemes.netdna-cdn.com/themes/aegaeus_wp/wp-content/themes/AegaeusWP/images/sprites/action-border.png); background-repeat: repeat-x; background-position: center bottom; } .plan-item-header { padding: 0px 15px 15px; text-decoration: none; color: #767676; -webkit-border-top-left-radius: 2px; -webkit-border-top-right-radius: 2px; -moz-border-radius-topleft: 2px; -moz-border-radius-topright: 2px; border-top-left-radius: 2px; border-top-right-radius: 2px; border-bottom: 1px solid #F4F4F4; background-color: #FCFCFC; -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out; } h4 { font-size: 16px; letter-spacing: -.2px; line-height: 36px; } .plan-item ul { margin: 20px 0 0; } .plan-item li, .plan-item ul { margin: 0; padding: 0; } .plan-item li, .plan-item ul { margin: 0; padding: 0; } .plan-item li:nth-child(even) { background-color: #FAFAFA; } .plan-item li { padding: 10px 20px; border-bottom: solid 1px #F4F4F4; color: #545454; -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out; } .plan-item-button { padding: 30px 0; } .plan-item-button a { padding: 10px 20px; background-color: #567; color: #D9D9D9; font-size: 12px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; font-weight: 700; -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out; -moz-box-shadow: inset 0 14px 0 0 rgba(190,190,190,.1); -webkit-box-shadow: inset 0 14px 0 0 rgba(190, 190, 190, 0.1); box-shadow: inset 0 14px 0 0 rgba(190, 190, 190, 0.1); text-decoration: none; } .clearfix { zoom: 1; } .plan-item ul { margin: 20px 0 0; } ol, ul { list-style: none; } .plan-item-button a:hover, .page-pagination a.current { background-color: #FF6838; } .plan-item:hover{ border-top-color: #FF6838; } li.plan-item-price { margin-top: -19px; font-size: 26px; padding: 20px; line-height: 1!important; color: #656565; font-weight: 700; } </style> <div class="pricing-table clearfix"> <div class="col-3"><div class="plan-item layers"><h4 class="plan-item-header">Simestral</h4><ul class="plan-item-features"> <li class="plan-item-price">R$000</li> <li>Válido por 6 meses</li> <li>Domínio e hospedagem inclusos</li> <li>1 E-mail Personalizado (10GB de espaço)</li> <li>Cobrada taxa mínima de Atualização</li> <li>Site seguro</li> <li>Suporte via e-mail</li> </ul><div class="plan-item-button"><a href="#">ADQUIRIR</a></div></div></div> <div class="col-3"><div class="plan-item layers"><h4 class="plan-item-header">Anual</h4><ul class="plan-item-features"> <li class="plan-item-price">R$000</li> <li>Válido por 1 Ano</li> <li>Domínio e hospedagem inclusos</li> <li>2 E-mails Personalizados (10GB de espaço)</li> <li>Desconto na taxa mínima de Atualização</li> <li>Site seguro</li> <li>Suporte via E-mail/Whatsapp</li> </ul><div class="plan-item-button"><a href="#">ADQUIRIR</a></div></div></div> <div class="col-3"><div class="plan-item layers"><h4 class="plan-item-header">Pentacampeão</h4><ul class="plan-item-features"> <li class="plan-item-price">R$000</li> <li>Válido por 5 Anos</li> <li>Domínio e hospedagem inclusos</li> <li>10 E-mails Personalizados (10GB de espaço)</li> <li>Sem taxa de Atualização</li> <li>Site seguro</li> <li>Suporte via E-mail/Whatsapp/Telefone</li> </ul><div class="plan-item-button"><a href="#">ADQUIRIR</a></div></div></div> </div>
-
Por murilo marchesi
pessoal estou com um menu retratil que funciona direitinho ,mais ao adicionar outras divs ( fiz uma box e uma box pra um banner) o meu hover só funciona quando coloca o cursor bem no cantinho do texto - (editado) achei o conflito - esta na tag <nav>que fiz para criar uma nova div ,tirei ela o hover voltou ao normal ,mais dai só uma div funciona ! ps : ja tentei por " <div class="class1 class2></div> mais nao funcionou ,só uma div que funciona tbm
.link:hover {
background-color:#F51D1D;
}
-
Por bruno4away
Gostaria de saber o que tenho que fazer, para que o botão da lupa fique no campo text de pesquisa no site:
eu fiz os códigos:
CSS
.header form#quick-search{ background: transparent; border: none; padding-top: 16.25px; padding-right: 45px; float: right; } .header input#search{ color: #EAECEE; width: 194px; height: 26px; border-radius: 4px; border: 1px solid #4E699D; font-size: 20px; background-color: white; background-image: url(../images/search-icon.png); background-position: 170px; background-repeat: no-repeat; padding: 10px 10px; } HTML <form id="quick-search" method="post"> <input id="search" type="text" value="Pesquisar..."> </form> Eu gostaria de saber o que preciso para que o botão pesquisar, fique no campo de texto do lado direito, se alguém souber de uma dica..
-
POWERED BY:
Como eu adiciono mais tags. Pseudoelementos tais como flex, no meu dw cs6?
Compartilhar este post
Link para o post
Compartilhar em outros sites