Skip to main content
tags editadas
Link
Sam
  • 80,8mil
  • 22
  • 73
  • 127

precisoPreciso estilizar o texto que há dentro do selectselect, como deixar centralizado, colocar margens, estou. Estou colocando o nome da classe + 'option'mais option e colocando o que desejo, porém não está funcionando.

  Fiz assim:  

HTML

<h3 class="imobBoxTipoTitulo">Tipo</h3>    
<div>
    <select class="imobBoxTipo">
       <option>Todos</option>
       <option>Teste1</option>
           <option>Teste2</option>
    </select>
</div>
<div class="clear"></div>
<div class="imobValor">
    <div class="imobValorEsq">
        <h3 class="imobBoxTipoTitulo">Valor</h3>
        <select class="imobBoxTipo imobBoxTipoValor">
           <option>De</option>
           <option>Teste1</option>
           <option>Teste2</option>
        </select>
    </div>
    <div class="imobValorDir">
        <select class="imobBoxTipo imobBoxTipo">
           <option>At&eacute;</option>
           <option>Teste1</option>
           <option>Teste2</option>
        </select>
    </div>
</div>

CSS

.imobBoxTipoTitulo{font-family: "Trebuchet MS", Helvetica, sans-serif;font-size: 9px;font-weight: bold;color:#b8b8b8;text-transform: uppercase;}

.imobBoxTipo{
    width: 220px;
    float: left;
   height: 34px;
   overflow: hidden;
   background: url(../images/arrow.jpg) no-repeat right #ddd;
   border: 1px solid #ccc;
   }
.imobBoxTipo select{
    width: 260px;
    margin-left: 16px;
    background-color: #f2f2f2;
    height: 38px;
    line-height: 38px;
    font-family: "Trebuchet MS", Helvetica, sans-serif!important;   
    color: #515151;
    font-size: 12px;
    background: transparent;
}
.imobBoxTipoValor{width: 110px;}

http://jsfiddle.net/felipestoker/3AK7V/JSFiddle

preciso estilizar o texto que há dentro do select, como deixar centralizado, colocar margens, estou colocando o nome da classe + 'option' e colocando o que desejo, porém não está funcionando.

  Fiz assim:  http://jsfiddle.net/felipestoker/3AK7V/

Preciso estilizar o texto que há dentro do select, como deixar centralizado, colocar margens. Estou colocando o nome da classe mais option e colocando o que desejo, porém não está funcionando. Fiz assim:

HTML

<h3 class="imobBoxTipoTitulo">Tipo</h3>    
<div>
    <select class="imobBoxTipo">
       <option>Todos</option>
       <option>Teste1</option>
           <option>Teste2</option>
    </select>
</div>
<div class="clear"></div>
<div class="imobValor">
    <div class="imobValorEsq">
        <h3 class="imobBoxTipoTitulo">Valor</h3>
        <select class="imobBoxTipo imobBoxTipoValor">
           <option>De</option>
           <option>Teste1</option>
           <option>Teste2</option>
        </select>
    </div>
    <div class="imobValorDir">
        <select class="imobBoxTipo imobBoxTipo">
           <option>At&eacute;</option>
           <option>Teste1</option>
           <option>Teste2</option>
        </select>
    </div>
</div>

CSS

.imobBoxTipoTitulo{font-family: "Trebuchet MS", Helvetica, sans-serif;font-size: 9px;font-weight: bold;color:#b8b8b8;text-transform: uppercase;}

.imobBoxTipo{
    width: 220px;
    float: left;
   height: 34px;
   overflow: hidden;
   background: url(../images/arrow.jpg) no-repeat right #ddd;
   border: 1px solid #ccc;
   }
.imobBoxTipo select{
    width: 260px;
    margin-left: 16px;
    background-color: #f2f2f2;
    height: 38px;
    line-height: 38px;
    font-family: "Trebuchet MS", Helvetica, sans-serif!important;   
    color: #515151;
    font-size: 12px;
    background: transparent;
}
.imobBoxTipoValor{width: 110px;}

JSFiddle

Fonte Link
Felipe Viero Goulart
  • 3,8mil
  • 17
  • 73
  • 106

Estilização de Select via CSS

preciso estilizar o texto que há dentro do select, como deixar centralizado, colocar margens, estou colocando o nome da classe + 'option' e colocando o que desejo, porém não está funcionando.

Fiz assim: http://jsfiddle.net/felipestoker/3AK7V/