SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Guru
    Join Date
    Feb 2009
    Posts
    994
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE7 Input field issue - extra bottom margin or padding - hasLayout issue ?

    Hello all,

    By taking into consideration the following page in IE 7:

    http://help.nuvemk.com/testStructure2/

    Our input fields seem to have an extra bottom space that I can't identify if it's margin or padding, but the issue is there.

    Is this a common bug ?

    We do have specific style sheet file to target IE7 so, any specific rule to target that browser only it's totally ok.

    Please advice, and totally clueless here.

    m.

  2. #2
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    Trying to assign margin OR padding to form elements is most always a disaster cross-browser, as not only do no two browsers start with the same values, they also do not apply padding the same way. FF and IE have default paddings, one in px, the other in EM, that no amount of playing with padding will EVER change... and both of those browsers treat them as some form of 'special' element when applying width/height... FF obeying height and ignoring line-height, IE obeying line-height and ignoring height... Opera actually treats them as ordinary *SHOCK* inline-block ... and don't even get me STARTED about what the webkit nimrods have done with form elements.

    My advice -- don't even TRY to apply margins, padding, or any other type of measurement to form elements and expect it to match across browsers, because it won't. The BEST you can hope for is to pad their parent element and prey that they all end up the same size on their own. Anyone tells you otherwise, they have no clue what they are talking about.

    Of course, all the HTML 5 a decade before it should be deployed, even with the bloated wasteful stupid javascript SHIV certainly can't be helping matters; especially with trying to use the new document structure WAY before anything even supports it. The presence of the target attribute pretty much showing what I'm always talking about where HTML 5 is for the people who never embraced STRICT and just continue to write HTML 3.2... Which is how you're ending up with about 7.8k of code to do 4.3k's job.

    If you actually care about supporting legacy browsers, forget HTML 5 even exists... If you care about making clean accessible minimalist code that loads quickly... forget HTML 5 exists... Newer isn't always better... much less ready for primetime.

    -- edit -- Oh, you MIGHT also try floating the inputs and/or throwing different vertical-alignments at them AND their parent until it all lines up. INPUT and SELECT are... kind-of inline-block but not really in FF/IE, so their behavior with vertical-align is... quirky.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,789
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    HI,

    You re not talking about the default margin on the form element are you?

    Code:
    form{margin:0}
    Don't worry about minor pixel differences on form controls between browsers because as Jason said they all have their own way of doing things and fixing one browser quite often breaks another one.

  4. #4
    SitePoint Guru
    Join Date
    Feb 2009
    Posts
    994
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    HI,

    You re not talking about the default margin on the form element are you?

    Code:
    form{margin:0}
    Actuaaaally... aahhm... I guess I was.

    I generally don't use resets of any kind, only when I need them, but I didn't know IE 7 would have that rule applied.

    About pixel perfection, indeed I would never look at that while designing for web.

    About the HTML5 ... it's ok. I'm ok with that. And I usually develop over strict. And I love the pleasure of seeing the validator trowing 0 errors found.

    Thanks for your input. Always learning here. Cheers


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •