The size of form input fields

Do you have a working example or code to look at?

I believe IE causes problems with a lot of things because of the way it interprets padding. (don't even go into the things you have to do to get divisions to look right).

Does your code look something like this?
<INPUT TYPE="TEXT" SIZE="30" STYLE="width: 300px">'

or in css...
input { width: 300px; }'

If you give us your code, maybe someone can help.

Hi KarenArt,

It looks like this:

Information

Title

etc ...

Looking at how IE5/6 handles the size of the td due to the input field, it seems as
though it keeps a fixed size, despite any explicit CSS commands to set the height in the td
and/or in the input ..... Any input is greatly appreciated....

/gad

Hmmm....

Looking at what you have the cell above it (with the word "Information" in it) is fixed at 300 px.
Since this cell streaches across the entire table, it is setting the total width of your table to 300 pixels. That's what you want right?

I'm not sure how you have the input size defined.
What is your css code for the "inmain" class?

Yes , the width is the wanted one. The COLSPAN diff, I just noticed,
would make no diff.

my input fields are defined by:

.inmain{
font-family:sans-serif, arial;
font-style:normal;
font-weight:900;
font-size:70%;
color:rgb(65,65,65);
background-color:rgb(252,255,230);
border:0px;
margin:0px;
padding:0px;
text-align:left;
vertical-align:top;
width:140px;
height:14px;
}

I'm not exactly sure what you're having problems with.
Are you needing the input's width to be pixel perfect and it breaks in IE?
Is there a height issue?

Also what's in the rest of your table cells?
Is there something to the right of that input that's throwing things off for you?

Sorry to be so unhelpful, but I'm confused what you want to accomplish.

btw: if you want to see how far you can go with a form take a look at http://www.picment.com/articles/css/funwithforms/
I doubt if I'd ever go to that much work for a form, but it does look interesting.

Thank you for your patience, KarenArt.

My issue is the rendered height of rows. Regardless of explicit definitions in tr's, td's and input's
the height is constant for small fonts, mking the table containing the form look sparse, if not silly,
in IE6.

Despite setting the cellspacing and cellpadding to 0 in the table as well as forcing each td (and tr for that matter) to margin:0 and padding:0, making it lokk just fine in mozilla, it will not do so in IE. The same table configuration but without inputs generates the desired result in IE6 as well, *but* *not* when using text-input fields.....

Anybody has a clue? Is this a problem or am I just raving mad

/gad

Actually, thank you for your patience... because I still have trouble keeping up with all the IE quirks and sometimes it takes me awhile to get it right.

What I do know: IE will be quirky with the way they handle padding of element and things like heights and widths often have to be adjusted to be pixel perfect for that browser.
Also IE will override a height setting of less than the line-height of the element instead of obeying the height attribute.

There is also the added problem of making sure row heights are consistant with each other.

I can give it a try to help you track this down.
Can you post the code for the entire table along with your css?
There are so many "tiny" things that can throw something like this off.

If someone else sees something obvious I'm missing... I sure hope they'll say something.

Thank you for the offer! Well, have have posted the inmain CSS def above,
so here is my inmainlabel CSS def:
td.inmainlabel{
font-family:sans-serif, arial;
font-style:normal;
font-weight:900;
font-size:70%;
color:rgb(15,15,15);
background-color:rgb(248,252,214);
text-align:left;
vertical-align:top;
border:0px;
margin:0px;
padding:0px;
width:0px;
}

The table is :

Information
Titel

Förnamn  

Efternamn  

Besök

Post

Postnr
Postort
Land
Vxel

Direkt

Mobil

FAX

Epost

WWW

Leveransadress
Adress
C/o
Postnr
Ort
Land

A bit much to ship in the forum perhaps but ....

Will this suffice?

/gad

Adding:
.of8b {
font-family:sans-serif,arial;font-style:normal;font-weight:900;font-size:72%;}
.of12b {
font-family:sans-serif,arial;font-style:normal;font-weight:900;font-size:90%;}

Ok... I don't know if this is going to do anything yet to IE (don't have that one reinstalled on my machine yet)

I do know this fixed up the heights in Safari on my Mac though...

In your tds where you have the input fields add your inmain class like this...

'
Do that for all the tds with an input in them.
The browsers aren't seeing a height set for those cells.

If that doesn't work, we'll try something else.

PS: as a side note it's a good habit to get into to use quotes like class="inmain" and colspan="3" instead of class=inmain and colspan=3.
It's not a killer, but it's just good to do.

Thank you KarenArt!

It appears to solve the problem. Ergo: To have IE6 to accpet the field size, both the TD and
the INPUT must have the same class ? In any case, the inter-row-spaces are now history.
Thanks a bundle!

/gad

I'm so glad it worked for you!
I have no idea if they need to have the same class for IE, but it seems the tds all need to have a height specified.

I don't know... it's still a lot of magic to me.

It does not help just to do style="height:px; in the td. I believe I've tried to class them early on as
well, but *not* with the *same* class...

regards
/gad