hi all,

I have done one work in using multiple select box in which i am fetching value of select boxes from database. This all work i have done using ajax. Like when we select country form first select box then it will show state comes under country. But now problem is that when i am selecting country form first select box then 2nd select box which is for state. This is dyanmically changes size . Sometimes it becomes large and sometime it is very short in size. Because value are changing dynamically . So i want now that size should be fixed of 2nd select box.

IS there any way in html code in which we can fix the size of 2nd select box or we can fix the larges size which it can be ?? how i can set this fix size?????

Please help me to solve this issue.
Thanks,
Gagan

hi all,

I have done one work in using multiple select box in which i am fetching value of select boxes from database. This all work i have done using ajax. Like when we select country form first select box then it will show state comes under country. But now problem is that when i am selecting country form first select box then 2nd select box which is for state. This is dyanmically changes size . Sometimes it becomes large and sometime it is very short in size. Because value are changing dynamically . So i want now that size should be fixed of 2nd select box.

IS there any way in html code in which we can fix the size of 2nd select box or we can fix the larges size which it can be ?? how i can set this fix size?????

Please help me to solve this issue.
Thanks,
Gagan

You'll see on most select's they have a line like this >------------------------< That bassicly is doing what you described.

You can specify the exact width of the <select> box using CSS.
Like:

<select style="width: 50px;">
    <option value="">- Select -</option>
    <option value="">A very long option name</option>
</select>

All decent browsers will show the box exactly 50px wide, but will expand the list itself to whatever size fits the data when opened.
(This does not include IE, who shows the list clipped to 50px width.)

To add to that you must set the display to block so as you can actually change the size of it or most browsers will ignore it.

To add to that you must set the display to block so as you can actually change the size of it or most browsers will ignore it.

Which browsers are you referring to?

I tested this in Firefox, Chrome, Opera and IE8 and they all properly resized it as an inline element.

Maybe this is more of an issue with more the element (maybe it was uputs) and more to do with the doctype. I was almost certain XHTML 1.0 requires you to state it as a block element.

Maybe this is more of an issue with more the element (maybe it was uputs) and more to do with the doctype. I was almost certain XHTML 1.0 requires you to state it as a block element.

Nope. Tried this on all the major browsers. Both HTML 4 and XHTML, strict and transitional.
All of the browsers resized it as expected without complaint.

Not that it should matter. This wouldn't be a part of the (X)HTML standards, but rather the CSS standard.
And it seems a rather odd requirement to make, really. What purpose would this serve?

For instance anchors don't resize without them being displayed as block.

Anyway is it really worth arguing over. I was wrong you were right (again).

For instance anchors don't resize without them being displayed as block.

Anyway is it really worth arguing over. I was wrong you were right (again).

You are actually right if we are talking about typical inline elements, such as <span> or <a>.
You can not set a specific width for those without setting their display style to block , or better yet inline-block .
Inline elements should have a more dynamic quality, so they can be resized by the browser as needed. (As I see it, anyways.)

Form elements on the other hand appear to be set to inline-block by default, which makes them respect set size styles, while still falling in line with other inline elements. (Much like the <img> tag.)

So neither of us was actually wrong, we just weren't talking about the same thing ;-)

This article has been dead for over six months. Start a new discussion instead.