SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Zealot honging's Avatar
    Join Date
    Jan 2001
    Location
    Chapel Hill, NC
    Posts
    160
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm having trouble with a simple input form. In IE, there is a "space" created under the form. It's annoying, to say the least, when I"m working with very compacted height space... does anyone know a cross-compliant way to remove the "space" below the input form?!

    Thanks.

  2. #2
    SitePoint Addict SLeon's Avatar
    Join Date
    Sep 2000
    Location
    Northern California
    Posts
    222
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There is a really weird answer to this one. (I had the same problem you did, and spent a huge number of hours searching for the answer.)

    Put the form in a table, but put the <form> tags AROUND the <td> tags. So your table will look like this:

    <table>
    <tr>
    <form>
    <td>
    Form contents
    </td>
    </form>
    </tr>
    </table>

    Try it. It works, no more irritating space under your forms
    InformationSavant - developing intelligent web business
    StrangePegs.com - collectible cards, games, toys, comics

  3. #3
    SitePoint Zealot honging's Avatar
    Join Date
    Jan 2001
    Location
    Chapel Hill, NC
    Posts
    160
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You have no idea how much that helped me. I am forever indebetd to you

  4. #4
    SitePoint Addict SLeon's Avatar
    Join Date
    Sep 2000
    Location
    Northern California
    Posts
    222
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You're welcome, glad I could help
    InformationSavant - developing intelligent web business
    StrangePegs.com - collectible cards, games, toys, comics

  5. #5
    SitePoint Wizard silver trophy
    beley's Avatar
    Join Date
    May 2001
    Location
    LaGrange, Georgia
    Posts
    6,117
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    You don't know how long I've wondered that!!! I have at least three clients that will LOVE me because of you! Thank you thank you thank you!

  6. #6
    SitePoint Zealot Overgrow's Avatar
    Join Date
    Jan 2001
    Location
    Your basement
    Posts
    192
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK if you liked that one....

    Sometimes you will find an annoying extra space inside of your supposed-to-be-tight table layout. The reason?

    Your close </td> tag is on a new line........ seriously........

    <td>
    <img src="image.gif">
    </td>

    will display differently (more space below the image) than

    <td>
    <img src="image.gif"></td>


    So if you're ever wondering where the heck that extra pixel or two of white space is coming from, try moving your </td>s up to the previous line.
    Overgrow the Government: The Edge Forums
    presented by Overgrow Marijuana Magazine

    *warning: adult content

  7. #7
    SitePoint Wizard
    Join Date
    Jan 2001
    Location
    Milton Keynes, UK
    Posts
    1,011
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just one thing to bear in mind with SLeon's code is that it isn't valid html having the form tags where they are. They need to be either outside the table or within the cell tags.

    One other way you can get around the spacing on the form is to use some css.

    Code:
    <form style="margin: 0px; padding: 0px">
    ..form contents
    </form>
    It might not work in older browsers but it'll work ok for IE4+ and N6.

  8. #8
    SitePoint Wizard silver trophy
    beley's Avatar
    Join Date
    May 2001
    Location
    LaGrange, Georgia
    Posts
    6,117
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    Thanks for all the tips! If anyone else has any interesting tidbits about HTML I'd love to hear 'em. Anything to help control the crazy world of HTML is a plus!

  9. #9
    SitePoint Addict SLeon's Avatar
    Join Date
    Sep 2000
    Location
    Northern California
    Posts
    222
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No, it's not valid HTML...which really annoyed me when I needed to know how to do this, because it seems to me that if it's not valid, it shouldn't work!

    However, I figured out how to do it by looking at some code on a really big site that we're all familiar with... *cough-SitePoint-cough* !

    But I'm sure that shane's suggestion is the better one, ultimately.

    Overgrow, I've had that same irritating problem with <td> tags... HTML is so funky!
    InformationSavant - developing intelligent web business
    StrangePegs.com - collectible cards, games, toys, comics

  10. #10
    Happy Holidays !! Paul S's Avatar
    Join Date
    Mar 2001
    Location
    Mexico
    Posts
    1,287
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by SLeon
    But I'm sure that shane's suggestion is the better one, ultimately.

    Overgrow, I've had that same irritating problem with <td> tags... HTML is so funky!
    Hi,

    Both are good suggestions but the second will fail with Nestcape 4.
    I read once that you can only remove the closing tag </form> (of course this isn't valid HTML), anybody have used it?

  11. #11
    SitePoint Zealot Overgrow's Avatar
    Join Date
    Jan 2001
    Location
    Your basement
    Posts
    192
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    another tip..........

    OK here's a little lesson in controlling input type=text

    Code:
    <input type="text" name="keywords" 
    
    size=<? if ($browser=="nav") { print"7";} else { print"15";}?> 
    
    maxlength=35 
    
    value="<?=$oldkeywords?>"
    
    onFocus="javascript:if(this.value==' Product Search'){this.value='';}" 
    
    style="margin:0px;">
    This is a typical input tag that I will use. Let's breakdown the interesting parts.

    size=<? if ($browser=="nav") { print"7";} else { print"15";}?>

    Ever notice that input boxes are bigger on Navigator than on Internet Explorer? This can be an annoying if your layout starts to stretch. You can't fix this with javascript... at least as far as I know. I've really tried. You can't open script tags in the middle of an input tag and you can't size the box after the page loads. Resolution? PHP. Earlier in the doc, you do a browser detection:

    PHP Code:
    <?

    if(eregi("msie.[4|5]",getenv('HTTP_USER_AGENT')))
        
    $browser "msie";
    // Netscape Navigator?
    else if(eregi("nav",getenv('HTTP_USER_AGENT')) or eregi("moz",getenv('HTTP_USER_AGENT')))
        
    $browser "nav";
    else
        
    $browser "other";

    ?>
    At that point I will also feed the style sheets. Errmm I'm a bit embarassed that I'm not detecting Opera, my favorite, in that routine. OK, the next interesting part requires no PHP:

    onFocus="javascript:if(this.value==' Product Search'){this.value='';}"

    Normally the default value of this box is "Product Search." Here I am telling the input that when the user clicks on the box, check to see if your value is "Product Search" -- if it is, that means the user wants to enter new data in the search box and you should clear yourself out.

    If the value was not Product Search it means the user had already entered data into the box and they want to edit it, so don't clear. This little piece of code allows you to label your search boxes very clearly AND you don't require the user to delete the labeling before they try and use it.

    </end class>
    Overgrow the Government: The Edge Forums
    presented by Overgrow Marijuana Magazine

    *warning: adult content


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
  •