Thread: CSS in forms

    #1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2001
    Location
    madrid, spain
    Posts
    17
    Rep Power
    0

    CSS in forms


    Is there any way to make my forms look the same in Netscape 4, Netscape 6 and Internet Explorer 5?

    I've tried lots of combinations with CSS but in some cases the size of the inputs where larger in IE, in other cases in NS4 and so on.

    Can anybody help me?
    TIA
  2. #2
  3. No Profile Picture
    Clueless llama
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Feb 2001
    Location
    Lincoln, NE. USA
    Posts
    2,353
    Rep Power
    117
    I dont think this is possible as NS4.7 does not fully impliment the DOM, so what you can do with CSS in NS4.7 is limited. NS4.7 is just evil.
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2001
    Location
    New York
    Posts
    122
    Rep Power
    14
    Are you talking about using css for colors, border, etc. or just trying to get the form elements the same size across browsers?

    If you're experiencing size problems (widths) in text boxes, selects, etc. you can minimize the difference by making sure that you're using a monospaced font within the form elements. It's ugly but it does the trick.

    As an alternative you could generate the text boxes via javascript and assign different sizes according to the user's browser.

    Hope this was helpful.
  6. #4
  7. No Profile Picture
    Clueless llama
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Feb 2001
    Location
    Lincoln, NE. USA
    Posts
    2,353
    Rep Power
    117
    Ironically enough, the only browser you can set the text field font on is Netscape. If you wrap a textfield in font tags in IE, it ignores the font tag, where it renders the text in the textfield modified by the font tag in NS. Go figure.
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2001
    Location
    New York
    Posts
    122
    Rep Power
    14
    Nemi:

    I've never tried to use <font> tags to style text-fields, but you CAN set text-field font-faces cross-browser using the style attribute of the <input> tag. The following code illustrates that with the font-family specified as "monospace", both IE5.x and NN4.x render the width of the element pretty close to the same (165px in this case).


    <html>
    <head></head>
    <body>
    <form name="form">
    <input type="text" value="hello world" style="font-family:monospace;">
    <br>
    <!-- here's a ruler, to compare browsers: -->
    <img src="image/spacer.gif" height="3" width="165" border="1">
    </form>
    </body>
    </html>


    Now, if I could just convince designers that monospace is a nice looking font!
  10. #6
  11. No Profile Picture
    Clueless llama
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Feb 2001
    Location
    Lincoln, NE. USA
    Posts
    2,353
    Rep Power
    117
    Ah yes, you are correct sir. I did try an inline style, but I used the short hand 'font' property and failed to set the font size, thinking it was optional when it is not.
    Code:
    <p style='font:courier'>some text here</p>
    This is what I did. I don't know why I was thinking all parameters were optional. the first three are, but you must specify a size AND a family. Doh! GJ

IMN logo majestic logo threadwatch logo seochat tools logo