Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Junior Member
    Join Date
    Jul 2010
    Posts
    4
    Member #
    22433
    *** there is a gap of about 50px between the "form cell" and the last "cell menu". I'm curious if it would be better code to use a list rather than links within a table cell, however, either way that gap is left between both the image in the "form cell", and the "cell menu". any help would be greatly appreciated. thanks!!



    <html>
    <head>
    <title>
    blah blah blah
    </title>
    <link rel="stylesheet" type="text/css" href="css/layout.css">
    <style type="text/css">
    #login {
    position: relative;
    top: -200px;
    left: 150px;
    }

    ul {
    list-style-type:none;
    margin: 0;
    padding: 0;
    }
    li {
    display: inline;
    }

    p.cell {
    background-image: url('images/clogin.jpg');
    border-width: thin;
    width: 900;
    height: 350;
    }

    </style>

    </head>

    <body>

    <table align="center" width="900">


    </br></br></br></br>

    <tr>
    <td>
    <a href="index.html">
    <img src="http://www.webdesignforums.net/images/wp.png" border="none" alt="begins here" />
    </a>
    </td>
    </tr>

    <tr>
    <td>
    <p class="cell">
    </p>
    <form action="" id="login">
    username: <input type="text" name="username" />
    </br>
    password: <input type="password" name="password" />
    </form>
    </td>
    </tr>

    <tr>
    <td align="right">
    <a href="index.html" >
    home
    </a>
    |
    <a href="gallery.html" >
    gallery
    </a>
    |
    <a href="about.html" >
    about us
    </a>
    |
    <a href="contact.html" >
    contact wp
    </a>
    </td>
    </tr>

    </table>

  2.  

  3. #2
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    can you link to a page where we can see this?

  4. #3
    Junior Member
    Join Date
    Jul 2010
    Posts
    4
    Member #
    22433
    unfortunately.

    i cannot, because this isn't a functioning site, yet.

    let me add, though, that without the "form", there is NO gapping at all.

  5. #4
    Junior Member Psyche1012's Avatar
    Join Date
    May 2009
    Location
    Indiana
    Posts
    27
    Member #
    19018
    Here's a little HTML taken off a free template Multiflex-3 Update-2 / Layout-1

    Hopefully this will help you out a bit.


    <h1 class="block">7 - Miscellaneous</h1>
    <div class="column1-unit">
    <h1>Login form</h1>
    <div class="loginform">
    <form method="post" action="index.html">
    <p><input type="hidden" name="rememberme" value="0" /></p>
    <fieldset>
    <p><label for="username_1" class="top">User:</label><br />
    <input type="text" name="username_1" id="username_1" tabindex="1" class="field" onkeypress="return webLoginEnter(document.loginfrm.password);" value="" /></p>
    <p><label for="password_1" class="top">Password:</label><br />
    <input type="password" name="password_1" id="password_1" tabindex="2" class="field" onkeypress="return webLoginEnter(document.loginfrm.cmdweblogin);" value="" /></p>
    <p><input type="checkbox" name="checkbox_1" id="checkbox_1" class="checkbox" tabindex="3" size="1" value="" onclick="webLoginCheckRemember()" /><label for="checkbox_1" class="right">Remember me</label></p>
    <p><input type="submit" name="cmdweblogin" class="button" value="LOGIN" /></p>
    <p><a href="#" onclick="webLoginShowForm(2);return false;" id="forgotpsswd_1">Password forgotten?</a></p>
    </fieldset>
    </form>
    </div>
    </div>

  6. #5
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    You need to get rid of "white space" (extra carriage returns),
    especially within your <a href> tags. Try doing this (to all of your tags):

    Code:
    <tr>
    <td align="right">
    <a href="index.html" >home</a> | <a href="gallery.html" >gallery</a> | <a href="about.html" >about us</a> | <a href="contact.html" >contact wp</a>
    </td>
    </tr>


  7. #6
    Senior Member
    Join Date
    Dec 2009
    Location
    Chicago, IL
    Posts
    114
    Member #
    20579
    Liked
    2 times
    fyi, by default the form tag has margins and/or padding depending on your doctype. make sure to designate a doctype in order to get the most consistent display results.

    try to put into your css:
    form {
    margin: 0;
    padding: 0;
    }


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 04:21 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com