Re: text box too wide when width set to 100%

Why don't you just use <input type="text" style="width:15em;"> ?
Of course you should set the font-family and size to the same as the
the rest of the page first (to ensure the same value of em), but that
should work afaics.

Setting the width doesn't work as the padding and border are then added
outside of the 15ems... kind of counter intuitive to a newbie like me, but
those I guess are the W3C specs!

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

Piers Lawson wrote:

Why don't you just use <input type="text" style="width:15em;"> ?
Of course you should set the font-family and size to the same as the
the rest of the page first (to ensure the same value of em), but that
should work afaics.

Setting the width doesn't work as the padding and border are then added
outside of the 15ems... kind of counter intuitive to a newbie like me, but
those I guess are the W3C specs!

So, make it a little smaller. Padding and border can be set to ems
too, so just add them up to be 15em together.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: Squeeze - Love Circles

So, make it a little smaller. Padding and border can be set to ems
too, so just add them up to be 15em together.

It appears that IE and FireFox already have ideas about what padding and
border should be used. For instance in FireFox the left border is 2px, the
right border is 1px. The left and right padding are 1px.

I can force these to use em e.g.

<input type='text' style='width:14.6em;border: 0.1em groove; padding:
0.1em 0.1em 0.1em 0.1em; font-size:1em'>

Which does fit perfectly... however it doesn't look like a normal text box
because:

1) As the text size is increased, the border thickness increases

2) I have had to force a text box's font size of 1em in order that the
calulations work (the font size in a text box is usully less than the
surronding text.

Thanks for your ideas though! I just wish setting a text box's display type
to block worked as some others thought it would!

Piers