Form elements not same size (text / textarea)

Discussion in 'HTML' started by Elliot Lewis, Jun 23, 2003.

  1. Elliot Lewis

    Elliot Lewis Guest

    I have created a simple form with these elements: input type text and
    textarea.

    The text areas have scrollbars. By visually looking at the form in I.E. 6 I
    have set their size and cols values to 18, and they are both the same width
    hand look good.

    In my browser they line up, but look different in I.E. 5 and 5-5 and more
    annoyingly different on the clients machine under I.E. 6.

    Is there a way to keep these form elements the same width?

    Elliot.
     
    Elliot Lewis, Jun 23, 2003
    #1
    1. Advertising

  2. Elliot Lewis

    blib Guest

    > In my browser they line up, but look different in I.E. 5 and 5-5 and more
    > annoyingly different on the clients machine under I.E. 6.
    >
    > Is there a way to keep these form elements the same width?
    >
    > Elliot.
    >

    I remember having to do this for a fussy client a few years back who wanted
    his form to look the same in both IE4+ and NN 4.x . I used a bit of
    unreliable JS to find out the User Agent and then created the form elements
    on the fly with JS varying the size attribute.

    Thomas
     
    blib, Jun 23, 2003
    #2
    1. Advertising

  3. Elliot Lewis

    Elliot Lewis Guest

    I was hoping it wouldn't come to that. My main concern is the same form
    having different width in I.E. 6 on different machines.
    Surely the same browser should look the same on all versions of windows?

    "blib" <> wrote in message
    news:bd74qk$ps81b$...
    > > In my browser they line up, but look different in I.E. 5 and 5-5 and

    more
    > > annoyingly different on the clients machine under I.E. 6.
    > >
    > > Is there a way to keep these form elements the same width?
    > >
    > > Elliot.
    > >

    > I remember having to do this for a fussy client a few years back who

    wanted
    > his form to look the same in both IE4+ and NN 4.x . I used a bit of
    > unreliable JS to find out the User Agent and then created the form

    elements
    > on the fly with JS varying the size attribute.
    >
    > Thomas
    >
    >
     
    Elliot Lewis, Jun 23, 2003
    #3
  4. Elliot Lewis pounced upon this pigeonhole and pronounced:

    [top posting corrected]
    >
    > "blib" <> wrote in message
    > news:bd74qk$ps81b$...
    > > > In my browser they line up, but look different in I.E. 5 and 5-5 and

    > more
    > > > annoyingly different on the clients machine under I.E. 6.
    > > >
    > > > Is there a way to keep these form elements the same width?
    > > >
    > > > Elliot.
    > > >

    > > I remember having to do this for a fussy client a few years back who

    > wanted
    > > his form to look the same in both IE4+ and NN 4.x . I used a bit of
    > > unreliable JS to find out the User Agent and then created the form

    > elements
    > > on the fly with JS varying the size attribute.
    > >
    > > Thomas
    > >


    > I was hoping it wouldn't come to that. My main concern is the same form
    > having different width in I.E. 6 on different machines.
    > Surely the same browser should look the same on all versions of windows?


    Surely all your visitors cannot have the exact same window sizes, default
    font sizes, screen resolution, maximized or otherwise browser.

    You can't make them all look alike. You can't even make them look alike
    for the *same* version of a browser.

    What will you do when they start installing Mozilla or Opera? ..which
    they will do as soon as the "Microsoft has stopped developing IE" gets
    around more.

    --
    -bts
    -This space intentionally left blank.
     
    Beauregard T. Shagnasty, Jun 23, 2003
    #4
  5. Elliot Lewis

    Elliot Lewis Guest

    Don't be an idiot.
    I do expect a table with width 100 to be the same relational size across all
    versions of the same browser.
    Therefore I expect a text field of 18 to be the same width as a textarea of
    18.
    Obviously you don't care about professional looking work.



    "Beauregard T. Shagnasty" <> wrote in message
    news:lAGJa.27280$...
    > Elliot Lewis pounced upon this pigeonhole and pronounced:
    >
    > [top posting corrected]
    > >
    > > "blib" <> wrote in message
    > > news:bd74qk$ps81b$...
    > > > > In my browser they line up, but look different in I.E. 5 and 5-5 and

    > > more
    > > > > annoyingly different on the clients machine under I.E. 6.
    > > > >
    > > > > Is there a way to keep these form elements the same width?
    > > > >
    > > > > Elliot.
    > > > >
    > > > I remember having to do this for a fussy client a few years back who

    > > wanted
    > > > his form to look the same in both IE4+ and NN 4.x . I used a bit of
    > > > unreliable JS to find out the User Agent and then created the form

    > > elements
    > > > on the fly with JS varying the size attribute.
    > > >
    > > > Thomas
    > > >

    >
    > > I was hoping it wouldn't come to that. My main concern is the same form
    > > having different width in I.E. 6 on different machines.
    > > Surely the same browser should look the same on all versions of windows?

    >
    > Surely all your visitors cannot have the exact same window sizes, default
    > font sizes, screen resolution, maximized or otherwise browser.
    >
    > You can't make them all look alike. You can't even make them look alike
    > for the *same* version of a browser.
    >
    > What will you do when they start installing Mozilla or Opera? ..which
    > they will do as soon as the "Microsoft has stopped developing IE" gets
    > around more.
    >
    > --
    > -bts
    > -This space intentionally left blank.
     
    Elliot Lewis, Jun 24, 2003
    #5
  6. Elliot Lewis wrote:
    [please don't top post]
    > "Beauregard T. Shagnasty" <> wrote in
    > message news:lAGJa.27280$...
    >> Elliot Lewis pounced upon this pigeonhole and pronounced:
    >>
    >> [top posting corrected]
    >>>
    >>> "blib" <> wrote in message
    >>> news:bd74qk$ps81b$...
    >>>>> In my browser they line up, but look different in I.E. 5 and 5-5
    >>>>> and more annoyingly different on the clients machine under I.E. 6.
    >>>>>
    >>>>> Is there a way to keep these form elements the same width?
    >>>>>
    >>>>> Elliot.
    >>>>>
    >>>> I remember having to do this for a fussy client a few years back
    >>>> who wanted his form to look the same in both IE4+ and NN 4.x . I
    >>>> used a bit of unreliable JS to find out the User Agent and then
    >>>> created the form elements on the fly with JS varying the size
    >>>> attribute.
    >>>>
    >>>> Thomas
    >>>>

    >>
    >>> I was hoping it wouldn't come to that. My main concern is the same
    >>> form having different width in I.E. 6 on different machines.
    >>> Surely the same browser should look the same on all versions of
    >>> windows?

    >>
    >> Surely all your visitors cannot have the exact same window sizes,
    >> default font sizes, screen resolution, maximized or otherwise
    >> browser.
    >>
    >> You can't make them all look alike. You can't even make them look
    >> alike for the *same* version of a browser.
    >>
    >> What will you do when they start installing Mozilla or Opera?
    >> ..which they will do as soon as the "Microsoft has stopped
    >> developing IE" gets around more.
    >>

    > Don't be an idiot.


    may not be the most efficient motivational method to get the best out of
    people

    > I do expect a table with width 100 to be the same relational size
    > across all versions of the same browser.


    100 what?

    > Therefore I expect a text field of 18 to be the same width as a
    > textarea of 18.


    18 what?

    > Obviously you don't care about professional looking work.


    hmm - you really are trying hard to alienate the helpful and knowledgeable.
    good luck.

    --
    William Tasso - http://www.WilliamTasso.com
     
    William Tasso, Jun 24, 2003
    #6
  7. Elliot Lewis

    rf Guest

    "Elliot Lewis" <> wrote in message
    news:bd92b1$gcv$...
    >
    >
    > "Beauregard T. Shagnasty" <> wrote in message
    > news:lAGJa.27280$...
    > > Elliot Lewis pounced upon this pigeonhole and pronounced:
    > >
    > > [top posting corrected]
    > > >
    > > > "blib" <> wrote in message
    > > > news:bd74qk$ps81b$...


    > > > > > In my browser they line up, but look different in I.E. 5 and 5-5

    and

    > > Surely all your visitors cannot have the exact same window sizes,

    default
    > > font sizes, screen resolution, maximized or otherwise browser.


    [top posting corrected AGAIN]

    <rant>

    > Don't be an idiot.


    The very first thing one must do to open a straw man argument
    ( http://www.google.com.au/search?q="straw man argument" )
    is to call ones opponent to order and to suggest that they may be of less
    than acceptable intelligence. This is mandatory. It sets the tone for the
    argument and casts the first seed of doubt into the mind of the casual
    observer.

    > I do expect a table with width 100 to be the same relational size across

    all
    > versions of the same browser.


    One then provides some irrelevant information or opinion which everybody
    must agree with, since it is usually quite true and accurate. This part of
    ones argument builds on the seed of doubt instilled earlier on and lulls the
    casual observer into a sense of security, leading said observer to believe
    that one actually does have something useful and meaningful to say.

    > Therefore I expect a text field of 18 to be the same width as a textarea

    of
    > 18.


    After this one presents the meat of the straw man argument. One rides on the
    sense of security and camaraderie one has established with the casual
    observer and one sneakily flows into the argument the assertion that what
    one "wants", *must* be so. It is crucial that one makes this part of the
    argument unambiguous and not open to any sort of questioning or evaluation b
    y the casual observer. It MUST be so. I EXPECT this to happen. This IS the
    way it is.

    > Obviously you don't care about professional looking work.


    One closes out ones argument with a parting shot at ones opponent, perhaps
    questioning their professional qualifications to have any sort of opinion at
    all on the matter to hand. Ones opponents reputation and even intelligence
    is now under serious evaluation and any argument ones opponent may have made
    is in tatters and must be seriously suspect.

    </rant>


    The subject of specifying the width of input elements in a consistent manner
    across different browsers is raised in this newsgroup and in most of the
    others at least once a month.

    The general consensus is that no matter what is suggested it will never,
    ever, look the same on all browsers. Some of them are wildly different.

    This consensus is largely made by people who have been intimately involved
    with HTML and the web in general for many years, many of them since its
    inception.

    Further consensus is that it does not matter. If a particular browser
    renders the elements at a different width then it will have done so for all
    pages the user of that browser has ever viewed. That user will be used to
    seeing them like that.

    The generally accepted rule is that there is no future in trying to make the
    input elements pixel perfect in all browsers and that such time spent trying
    to do so would be far better expended on refining the content of the page.

    Cheers
    Richard.
     
    rf, Jun 24, 2003
    #7
  8. Elliot Lewis

    Steve Pugh Guest

    "Elliot Lewis" <> wrote:

    >Don't be an idiot.


    Who is top posting and using insults?

    >I do expect a table with width 100 to be the same relational size across all
    >versions of the same browser.


    Irregardless of the content of the table and the user's default font
    size?

    <table width="100"><tr><td>Hello!</td></tr></table>
    Try that with a font size that means that the word Hello! can not fit
    within 100 pixels.

    The specs are quite clear that table widths are suggestions only and
    that the browser should ignore them if the content demands that they
    do so.

    >Therefore I expect a text field of 18 to be the same width as a textarea of
    >18.


    <input size="18">
    The 18 is the number of average width characters. The average width of
    a character varies with the font used, and the size of the font. As
    the different users may have very different font sizes set in their
    configurations there is no way you can expect the same input to be the
    same width in all browsers, even if they have the same name and
    version number.

    And you've probably already noticed that
    <input size="18"> and <textarea cols="18"> don't give the same width
    in many browsers anyway.

    Your expectations are quite unrealistic.

    >Obviously you don't care about professional looking work.


    Yeah whatever. Looking professional and being professional are
    different beasts. Guess what calling people idiots says about
    someone's professionalism.

    Steve


    --
    "My theories appal you, my heresies outrage you,
    I never answer letters and you don't like my tie." - The Doctor

    Steve Pugh <> <http://steve.pugh.net/>
     
    Steve Pugh, Jun 24, 2003
    #8
  9. Elliot Lewis pounced upon this pigeonhole and pronounced:
    > Don't be an idiot.
    > I do expect a table with width 100 to be the same relational size across all
    > versions of the same browser.
    > Therefore I expect a text field of 18 to be the same width as a textarea of
    > 18.
    > Obviously you don't care about professional looking work.
    >


    <snip the rest as it obviously was not understood>

    I've gotten back to the group and find that I am an idiot.

    Thank you very much. Thanks to the other posters who already have said
    everything I would want to say. My websites are very professional looking,
    and all validate xhtml 1.0 strict with valid css as well.

    Why not go curl up with a good book? Perhaps even one about usenet
    guidelines?

    --
    -bts
    -This space intentionally left blank.
     
    Beauregard T. Shagnasty, Jun 24, 2003
    #9
  10. Elliot Lewis

    Headless Guest

    "William Tasso" <> wrote:

    >[please don't top post]


    Please learn how to trim quotes.


    Headless
     
    Headless, Jun 24, 2003
    #10
  11. Elliot Lewis

    Elliot Lewis Guest

    > <snip the rest as it obviously was not understood>
    >
    > I've gotten back to the group and find that I am an idiot.
    >
    > Thank you very much. Thanks to the other posters who already have said
    > everything I would want to say. My websites are very professional looking,
    > and all validate xhtml 1.0 strict with valid css as well.
    >
    > Why not go curl up with a good book? Perhaps even one about usenet
    > guidelines?


    That's the kind of comment that made me reply and call you an idiot. Your
    reply had more intention of showing how clever you are about the web rather
    than being helpful. I was after advice from other web developers that could
    help me with a question I posted, not a lesson on how you cannot guarantee
    that all people will have the same browser (which of course I am aware of).
    Actually in this case I can guarantee they will, as the site is for an
    intranet and the standard is I.E. 6. It would have been more helpful to have
    answered the question or not posted a reply at all.

    As per my original post a text element set to 18 : <input name="newCostUnit"
    type="text" id="newCostUnit" value="0" size="18">
    and a text area underneath :<textarea name="newInfo" cols="18">, are the
    same width on some machines under I.E.6 and different with others (in the
    same browser version).

    It seems from the other 'helpful' replies my 'expectations are quite
    unrealistic'? But why? Isn't that the whole point of designing a layout?
    Items set to the same char length with the same font should align.
     
    Elliot Lewis, Jun 24, 2003
    #11
  12. Elliot Lewis pounced upon this pigeonhole and pronounced:
    > > <snip the rest as it obviously was not understood>
    > >
    > > I've gotten back to the group and find that I am an idiot.
    > >
    > > Thank you very much. Thanks to the other posters who already have said
    > > everything I would want to say. My websites are very professional looking,
    > > and all validate xhtml 1.0 strict with valid css as well.
    > >
    > > Why not go curl up with a good book? Perhaps even one about usenet
    > > guidelines?

    >
    > That's the kind of comment that made me reply and call you an idiot. Your
    > reply had more intention of showing how clever you are about the web rather
    > than being helpful.


    I am no more clever than all the others who replied.

    > I was after advice from other web developers that could
    > help me with a question I posted, not a lesson on how you cannot guarantee
    > that all people will have the same browser (which of course I am aware of).


    It wasn't evident that you were aware.

    > Actually in this case I can guarantee they will, as the site is for an
    > intranet and the standard is I.E. 6.


    An intranet? That does make a difference. You should have stated that.

    Even on an intranet, all using IE6, you will have users with varying
    default browser font sizes. Does the entire company consist of employees
    with perfect eyesight? Is every monitor set to 800x600 with 96dpi?

    > It would have been more helpful to have
    > answered the question or not posted a reply at all.


    I did provide an answer to your question. I suppose it wasn't the one you
    wanted.

    ....

    --
    -bts
    -This space intentionally left blank.
     
    Beauregard T. Shagnasty, Jun 24, 2003
    #12
  13. Elliot Lewis

    Steve Pugh Guest

    "Elliot Lewis" <> wrote:

    >As per my original post a text element set to 18 : <input name="newCostUnit"
    >type="text" id="newCostUnit" value="0" size="18">
    >and a text area underneath :<textarea name="newInfo" cols="18">, are the
    >same width on some machines under I.E.6 and different with others (in the
    >same browser version).


    Running on the same OS? IE is part of the Windows operating system and
    items such as form elements are inherited from the OS. So different
    versions of Windows can give different effects. Or even the same
    version of Windows with different settings.

    And then there are the user settings within the browser itself.

    >It seems from the other 'helpful' replies my 'expectations are quite
    >unrealistic'? But why?


    HTML is about marking up content. Once the content is marked up
    browsers will display it in a number of ways. You can't expect
    different elements with different attributes to display identically
    just because you've given them the same value? The fact that one
    element uses size and the other uses cols may have been a clue that
    they are different.

    >Isn't that the whole point of designing a layout?


    'designing a layout' sounds like a job for CSS to me, not HTML.

    >Items set to the same char length with the same font should align.


    Is it the same font? By default my IE6 uses a proportional font for
    input and a monospaced font for textarea.

    Can you post a URL so that we can see the surrounding HTML and CSS?
    These will obviously have an impact and the default situation I've
    described above may be further complicated by your code.

    Steve

    --
    "My theories appal you, my heresies outrage you,
    I never answer letters and you don't like my tie." - The Doctor

    Steve Pugh <> <http://steve.pugh.net/>
     
    Steve Pugh, Jun 24, 2003
    #13
  14. Elliot Lewis

    PeterMcC Guest

    Elliot Lewis wrote:
    <snip>
    I was after advice from other web
    > developers that could help me with a question I posted, not a lesson
    > on how you cannot guarantee that all people will have the same
    > browser (which of course I am aware of). Actually in this case I can
    > guarantee they will, as the site is for an intranet and the standard
    > is I.E. 6. It would have been more helpful to have answered the
    > question or not posted a reply at all.


    A quick hint for future posts: it would have been more helpful to have
    mentioned the intranet - that makes a huge difference to the nature of
    likely replies since a great deal of what gets asked here does need a
    response pointing out that the Internet is not a standardised environment.

    The majority of posters asking the type of question posed by yourself are
    not aware of the differences that browsers, monitors and personal
    preferences can make - it is helpful to them and their visitors that replies
    point out that it is impossible to get an exact duplication of a site's
    appearance across all situations. As it happens, that didn't apply to you
    but the respondents weren't aware of that.

    There is a reasonable assumption hereabouts that questions refer to the
    Internet unless othwise stated - had you been trying to get a match across
    all platforms on the Internet, the advice given would have saved you hours
    if not days of frustration.

    --
    PeterMcC
    If you feel that any of the above is incorrect,
    inappropriate or offensive in any way,
    please ignore it and accept my apologies.
     
    PeterMcC, Jun 24, 2003
    #14
  15. William Tasso, Jun 25, 2003
    #15
  16. Elliot Lewis

    Headless Guest

    "William Tasso" <> wrote:

    >Headless wrote:
    >> Please learn how to trim
    >>

    >How am I doing?


    Let's find out. There is only one correct answer, attempts to cheat
    result in failing the exam, you have 1 minute to complete it. When you
    have finished, get up from your desk (without disturbing any of the
    other examinees) and turn in your work to the exam supervisor at the
    front of the hall. Smoking is not allowed, answers in HTML will be
    discarded.

    This is your exam question: Which part of the following text should be
    quoted in a usenet follow-up:

    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.
    I shall quote only those parts of a previous post that are directly
    relevant to my reply.


    Headless
     
    Headless, Jun 25, 2003
    #16
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Augustus
    Replies:
    1
    Views:
    402
    Ken Schaefer
    Sep 10, 2003
  2. News Groups
    Replies:
    1
    Views:
    215
    Ray at
    Aug 11, 2004
  3. Textarea Inside of a textarea

    , Feb 4, 2006, in forum: ASP General
    Replies:
    6
    Views:
    364
    Anthony Jones
    Feb 5, 2006
  4. Mark Hannon
    Replies:
    3
    Views:
    206
    Randy Webb
    Sep 3, 2004
  5. Replies:
    1
    Views:
    359
    Bart Van der Donck
    Jul 4, 2007
Loading...

Share This Page