pequena duvida html

skullrazor

Portugal@Home Member
Boas
estou com uma pequena duvida em html... Bem eu tenho uma drop down list com o seguinte codigo:
Código:
<select>
  <option>Ricardo</option>
  <option>João</option>
  <option>Pedro</option>
</select>
ate aqui tudo bem, mas agora o texto aparece-me sempre alinhado à esquerda... como faço para centrar o texto da drop down list?

cumps
 
Troquei o <select> por <select style="text-align: center"> no IE7 e não deu. No entanto, fui ao Google, e aparentemente já muitos antes de mim fizeram o mesmo, e parece que funciona no Firefox e Opera... apenas.
E depois de pesquisar mais aprofundadamente, parece que não há nenhuma forma fácil de fazer isso. Pelo menos não vi ninguém a conseguir :wvsore:

Por acaso é uma questão curiosa.
 
Dessa forma nao vai dar, assim centra no IE Firefox e opera etc...:

<div style="text-align: center;">
<select>
<option>Ricardo</option>
<option>João</option>
<option>Pedro</option>
</select>
</div>

penso que entendi mal, centrar o texto dentro da combobox?
 
Última edição:
Não sei se isso dá no Firefox ou Opera, mas no IE7 não ajudou. Centrou a dropdown, mas não centrou cada item dentro da mesma, que é o objectivo.

edit - sim, deves ter percebido mal :P é isso
 
bem desde ja o meu obrigado pelas respostas e pela ajuda... realmente ja me tinha parecido que nao ia ser facil (muito menos para mim que ainda sou um pouco noob na materia xD)...
Kayvlim, por acaso isso que tentas.te eu ja tinha tentado e nao funciona mesmo no IE7, que no caso é o browser que uso e que pretendo que funcione...
whitehatg, como o Kayvlim ja referio, esse codigo centra a combobox, mas o que eu pretendo é que os itens da combobox fiquem centrados, e nao a combo mesmo...
agradeco toda ajuda que me possam continuar a dar para a resoluçao deste problema um pouco curioso (e dificil, pelos vistos xD)

cumps
 
Tens que usar javascript para o IE7, e não vai funcionar com todos os tipos de font, creio, pelo menos não tão certo.

Exemplo em baixo.


PHP:
<form>
<select name="slide"  style="text-align:center;font-family:monospace,courier,courier new" >
  <option>TEXTO CENTRADO EM BAIXO USANDO JAVASCRIPT BASEANDO-SE NO TAMANHO TOTAL DE UMA OPTION</option>
  <option>Ricardo</option>
  <option>João</option>
  <option>Pedro</option>
</select>
</form>

<script type='text/javascript'>

function centrarTextoSelect(caixa)
{
 for(var data={longest:0}, i=0, opts=caixa.options, len=opts.length; i<len; i++)
  if(opts[i].text.length>data.longest)
  {
   data.longest=opts[i].text.length;  
   data.idx=i;  
  }
  
 for(i=0,h=data.longest/2,pad=''; i<h; i++)
  pad+='\xa0';
  
 for(var i=0, space; i<len; i++)    
  if( i!=data.idx )
   opts[i].text=(space=pad.substring(0,(data.longest-opts[i].text.length)/2))+opts[i].text+space;
}


centrarTextoSelect(document.forms[0].slide);

</script>
 
Tens que usar javascript para o IE7, e não vai funcionar com todos os tipos de font, creio, pelo menos não tão certo.

Exemplo em baixo.


PHP:
<form>
<select name="slide"  style="text-align:center;font-family:monospace,courier,courier new" >
  <option>TEXTO CENTRADO EM BAIXO USANDO JAVASCRIPT BASEANDO-SE NO TAMANHO TOTAL DE UMA OPTION</option>
  <option>Ricardo</option>
  <option>João</option>
  <option>Pedro</option>
</select>
</form>
 
<script type='text/javascript'>
 
function centrarTextoSelect(caixa)
{
 for(var data={longest:0}, i=0, opts=caixa.options, len=opts.length; i<len; i++)
  if(opts[i].text.length>data.longest)
  {
   data.longest=opts[i].text.length;  
   data.idx=i;  
  }
 
 for(i=0,h=data.longest/2,pad=''; i<h; i++)
  pad+='\xa0';
 
 for(var i=0, space; i<len; i++)    
  if( i!=data.idx )
   opts[i].text=(space=pad.substring(0,(data.longest-opts[i].text.length)/2))+opts[i].text+space;
}
 
 
centrarTextoSelect(document.forms[0].slide);
 
</script>

obrigado pela ajuda desde ja, mas como tinha referido acima ainda sou um pouco noob na meteria, e dai nao sei absolutamente nada de javascript, por isso sinceramente nao entendi nada do codigo =/

ps: sei vb.net e c#, se der para fazer alguma coisa do genero em vez de java com uma destas duas linguagens talvez se torne mais facil :)

cumps
 
Ok.. estou a falar de javascript, e basta copiares isso e por e olhares para o exemplo que dei que percebes como funciona ,isso é uma função.

entao mas espera, é so eu acrescentar o que quizer na parte das options para aparecer na combobox? ou seja, o codigo é mesmo este?

cumps

EDIT:
testei o codigo com o dreamwaver e nao funcionou =/

cumps
 
Última edição:
<select style="text-align:center">
<option>Ricardo</option>
<option>João</option>
<option>Matias</option>
<option>Malaquias</option>
</select>


edit:

já vi que queres é no IE...esse browser do demónio :)
 
Última edição:
Testaste o código no Dreamweaver, mas o dreamweaver é um browser? Corre funções de javascript?

... Testa o código no IE e vais ver que funciona.
 
O IE não deixa alterar as select boxes. Só mesmo com javascript.
Agora tens é de ver se te compensa mais ter javascript ou não alterar o aspecto da box.
 
pois realmente funciona no IE, so que eu nao queria usar javascript, queria so mesmo html... mas visto que nao existe mais nenhuma soluçao vou pensar no que é melhor, ou usar javascript ou nao alterar nada na combobox... obrigado por toda a ajuda que me deram :D

cumps
 
Back
Topo