customizing listbox

admin

Administrator
Staff member
Hi,<br />
<br />
is it possible to set the size and alignment for a listbox ?<br />
<select> <br />
<option> ....<br />
..<br />
..<br />
</select><br />
It only gets as wide as the longest string in it and all strings are alligned to the left. Can that be changed? Or if it can't how do I make an alternative with the same form of input that can?<br />
<br />
thanks in advance<!--content-->Yes, you just use CSS:<br />
<br />
<select name="myselect" style="width:300px;"> <br />
...options here...<br />
</select><!--content-->or you can just do this... He got the "CSS" thing right but you can also do this <br />
<hr><br />
<select size="30" align=center><br />
<option>Hello<br />
<option>Hey<br />
<option>DUDE<br />
<hr><!--content-->Yep, I can adjust the size, but not the alignment. Are you sure about this? Both ways don't work in neitehr Mozilla nor IE.<!--content-->What version of IE are you using.. it works on mine and I am using i think 5.somethign or 6\<br />
<br />
If worst comes to worst... get HTML-Kit...<!--content-->hi chuvak...<br />
<br />
this <style> works in Moz and IE :<br />
($Opera has issues with it... but supposedly it's the perfect browser... so... whatever :rolleyes: )<br />
<br />
;) k<br />
<br />
<br />
select.drop {<br />
background-color:#006699;<br />
color: #fff;<br />
font-family: verdana;<br />
font-size: 13px;<br />
text-align: center;<br />
font-weight: bold;<br />
padding: 2px 2px 2px 2px;<br />
}<br />
<br />
<br />
<br />
<select class="drop" multiple size=5 name="drop1"><!--content-->> this <style> works in Moz and IE :<br />
<br />
Strange, it actually works in mozilla, but not IE.<br />
I have IE 6.0<br />
Maybe some patches are missing. I never bother Download <!--more-->ing either security or any updates because they come out way to often.<br />
<br />
> If worst comes to worst... get HTML-Kit...<br />
What's that?<br />
<br />
thanks<!--content-->hi chuvak...<br />
<br />
maybe i removed too much from my own code.<br />
try it with the change (in bold) and let me know if that makes any difference.<br />
;) k<br />
<br />
select.drop {<br />
display: block;<br />
background-color:#006699;<br />
color: #fff;<br />
font-family: verdana;<br />
font-size: 13px;<br />
text-align: center;<br />
font-weight: bold;<br />
padding: 2px 2px 2px 2px;<br />
}<!--content-->hi,<br />
<br />
unfortunatly it doesn't make difference.<br />
<br />
I thought just text-align: center; should be enough (and it is in mozilla)<!--content-->sorry then :(<br />
<br />
but I'm pretty sure that I saw that <style> actually center the text in an IE6 browser.<br />
<br />
unfortunately I'm not much of a CSS guru... so... :rolleyes:<br />
<br />
but maybe someone else will have some ideas for you :)<br />
<br />
;) k<!--content-->Try this:<br />
<br />
<div style="margin: auto; text-align: center;"><br />
<select name="select" style="width:300px;"> <br />
<option value="1">1 <br />
<option value="2">2 <br />
<option value="3">3 <br />
</select><br />
</div><!--content-->Originally posted by Jonathan <br />
What version of IE are you using.. it works on mine and I am using i think 5.somethign or 6\<br />
<br />
If worst comes to worst... get HTML-Kit... <br />
<br />
And them getting HTML-Kit does them no good in trying to solve their problem.<!--content-->
 
Back
Top