Stylesheets - Width Dependencies

Author

Width Dependencies

Paul Carey

2004-02-25, 12:32 pm

Hi

I'm developing an app that's translated into a number of different
languages. A particular page contains a form with a couple of select
boxes one on top of another. Because the form is quite complex I've
used a table to describe its structure. My problem is in trying to
align the select boxes correctly. Some select boxes might only be
numeric, containing one or two characters. Other text based ones
contain an arbitary number of characters depending on the language
selected by the user. How can I tell each select box that it should be
the same width as the widest select box? Any suggestions are much
appreciated.

Many thanks
Paul

What happens (each select box is in its own cell):

8\/
Indeterminate No Chars\/
Letters\/

What I'd like to happen:

8 \/
Indeterminate No Chars\/
Letters \/

Felipe Gasper

2004-02-25, 3:30 pm

You could try using Javascript DOM to a) read the computed width of the
widest select then b) set the CSS width of the other selects. Use
document.defaultView.getComputedStyle() (an example is at
http://www.csie.ntu.edu.tw/~b750605.../examples7.html) to read
the computed width, then plain ol' CSS DOM to assign the width.

I don't know how well it'll work in IE, but I am 90% sure that there's an
IE equivalent.

Another idea might be to fix the width of the enclosing td and make each
select 100% width. That avoids Javascript, which is generally a good idea.

cheers,
Felipe Gasper
Urbana, IL USA

On Wed, 25 Feb 2004, Paul Carey wrote:

> I'm developing an app that's translated into a number of different
> languages. A particular page contains a form with a couple of select
> boxes one on top of another. Because the form is quite complex I've
> used a table to describe its structure. My problem is in trying to
> align the select boxes correctly. Some select boxes might only be
> numeric, containing one or two characters. Other text based ones
> contain an arbitary number of characters depending on the language
> selected by the user. How can I tell each select box that it should be
> the same width as the widest select box? Any suggestions are much
> appreciated.

Lauri Raittila

2004-02-26, 12:32 pm

In article Paul Carey wrote:
> Hi
>
> How can I tell each select box that it should be
> the same width as the widest select box? Any suggestions are much
> appreciated.

Give width:100% for all exept the widest input box?

Supposing you have input in one table cell and label in other.

> What happens (each select box is in its own cell):

URL would be be nicer.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.