Welcome to WebmasterWorld Guest from 54.147.10.72

Forum Moderators: incrediBILL

Message Too Old, No Replies

Form tags in IE

Can I reduce the size of display

     

hydro

11:16 pm on Jul 30, 2001 (gmt 0)



I'm using the form tags to create a simple text box and submit button (eg: newsletter sign up) and it looks much smaller in Netscape than it does in IE.

Is there a way to reduce the size of the text box and button?

tedster

12:13 am on Jul 31, 2001 (gmt 0)

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Welcome to Webmaster World, hydro.

I've tripped over this one a bit. The appearance and usability of form pages can be critical - it's often where the rubber meets the road for an online business. And up until Netscape 4.5 or so, there are lots of oddities.

Here's the simpler part (the button): You can create your own graphic to use as a submit button -- any size or appearance you want. Instead of using type=submit, just use this code in the form.

<input type=image src="yourimage.gif" name="signup">

Now the more complicated part (the textarea): One way I found is to use CSS to keep the font both monospace and a given size. This seems to tame the browser differences pretty well. In the css file (or between <style> tags in the head section) you create a class:

.mono {font-family:Courier, monospace;font-size:10pt;}

Then your form can tap into this class:

<form class="mono">
<font class="mono"><textarea cols="25" rows="3"></textarea></font>
</form>

Note: I've found that I need to put the class in both the form tag and the font tag to get good cross-browser, cross-version results.

Sometimes, especially when I don't want that monospace look in the textarea, I use a browser sniffer JavaScript code so I can feed Netscape a different page altogether.

MikeFoster

2:56 am on Jul 31, 2001 (gmt 0)

10+ Year Member



Great tip tedster!

Key_Master

3:33 am on Jul 31, 2001 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Another way is to use the style attribute in the line. Examples:

<input type="text" name="Input" size="12" style="font-size: 10pt">

<textarea name="Body" cols="58" rows="10" wrap="physical" style="font-size: 10pt">

Xoc

8:20 am on Aug 1, 2001 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Welcome to WebmasterWorld, Key_Master.

I use the same basic idea as tedster suggested, except that I use a <span> tag instead of a <font> tag. I.e.:

<form class="mono">
<span class="mono"><textarea cols="25" rows="3"></textarea></span>
</form>

 

Featured Threads

Hot Threads This Week

Hot Threads This Month