homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

Form tags in IE
Can I reduce the size of display

10+ Year Member

Msg#: 915 posted 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?



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

Msg#: 915 posted 12:13 am on Jul 31, 2001 (gmt 0)

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>

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.


10+ Year Member

Msg#: 915 posted 2:56 am on Jul 31, 2001 (gmt 0)

Great tip tedster!


WebmasterWorld Senior Member 10+ Year Member

Msg#: 915 posted 3:33 am on Jul 31, 2001 (gmt 0)

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">


WebmasterWorld Senior Member 10+ Year Member

Msg#: 915 posted 8:20 am on Aug 1, 2001 (gmt 0)

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>

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved