text box IE vs Firefox ??

Posted on 2007-04-05
Last Modified: 2013-11-19
I created a text box for my web page.  In IE the text box appears wider than in Firefox.  I want the text box to look the same no matter what browser it is in.  If not, at least the same in Firefox and IE.  

How can I do this?

I have tried using CSS and it doesnt seem to work.

Question by:mmedi005
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions

Expert Comment

ID: 18860343
Can you post the code you've used so far?

That will help us tremendously in figuring out what's going on and how to fix it!

LVL 20

Expert Comment

ID: 18860400
<input type="text" style="width:100px;" />
LVL 23

Expert Comment

by:Saqib Khan
ID: 18860685
I tested in both brosers, and you code looks ok to me and looks same in both Browsers.
Don't Cry: How Liquid Web is Ensuring Security

WannaCry is just the start. Read how Liquid Web is protecting itself and its customers against new threats.


Author Comment

ID: 18860773
Hear is the thing, in my office, the text box looks the same on my computer, and others, but i have other computers stretching the textbox over the button.  

What are some resons why this would happen, i want everyone to be able to see it teh same way.  Is there a way to create the text in photoshop?

Author Comment

ID: 18860821
typo, on hear, teh, and whatever else i misspelled, sorry,

what characters make the submit crash?  having trouble copy paste code to post on teh forum...

thx again

Expert Comment

ID: 18861337
Some of the reasons for variability in the rendering of forms:

  * Forms elements can be quirky from browser to browser.
  * You can pretty much guarantee that submit buttons will look different, scrollbars will appear by default on empty textareas in most browsers, but not in FireFox, appearance of checkboxes, radio buttons, and dropdowns will vary.
  * If your users have installed a theme or otherwise customized the look of their browser, variability increases.  
  * You can use CSS to style form elements, but when I doing so, they often started looking more different instead of more alike at first.
  * Users who have specified their own default stylesheet or set the default size of the text may see different-sized or different-looking form elements.
  * Use of a forms tool like the one in the Google search bar will hijack background colors of some fields, making them yellow.

I do a lot of forms, and I deal with this by setting widths as indicated by steelseth12, trying to get things approximately the same, but expect variability nonetheless.

LVL 16

Expert Comment

by:Kiran Paul VJ
ID: 18862637
what steelseth12 posted should work fine.

some things worth noting,

1. Did u disable styles in FF
2. Is the resolution of computer same in both cases
3. Did you installed any addons in FF that alter the CSS styles
4. Does your adblocker blockes the style sheet in which the styles are written.


Author Comment

ID: 18863919
Those are issues that I can't help when it all depends on the persons computer.  I do use a style sheet.  What are the most important properties that I would need.  What would not make teh textbox change unless you really have bad settings on your pc?  

thx again

Accepted Solution

opho earned 125 total points
ID: 18864367
In my stylesheets I generally have something like:

input {
font-family: [make sure it's set at the same font as the rest of the site];
font-size: [same size, or a bit smaller than the site's standard];

And, beyond that, just specify the width as steelseth12 indicated in a style= parm.  

I've played with setting border styles and colors, as well as padding/margin, but haven't taken that very far.  The initial work seemed to make things more different instead of more alike between browsers and machines.


Featured Post

Why Off-Site Backups Are The Only Way To Go

You are probably backing up your data—but how and where? Ransomware is on the rise and there are variants that specifically target backups. Read on to discover why off-site is the way to go.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

691 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question