SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Enthusiast paramedic's Avatar
    Join Date
    Oct 2007
    Posts
    76
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Inputs not working

    Hi guys

    I am using a free template I got off of the web and I am trying to create a form so that people can enter some search criteria for a property site I am creating. The problem I am having is that I can't get any cursor on the screen. I can't see why it is not working. Below is an edited part of the script.

    HTML Code:
    <div id="right">
        <h2>Property Search!</h2>
      
    <form action="/display.php" method="GET" class="contact">
    <table align="center"width="410" border="0"  padding="0" > 
    
    
    <tr>
    <td>
    <label for="town" style="color:#85C2FF" >Location:</label>
    <input type="text" name="town" >
    </td>
    </tr>
    </table>
    </form>
        <h3>Company Profile</h3>
        <div id="profile">
          <div id="corp">
            <div id="corp-img"> Corporate Building </div>
            <p>If you're having problems editing the template please don't hesitate to ask for help on <a href="http://www.free-css.com/">the forum</a>.</p>
          </div>
          <div id="indu">
            <div id="indu-img"> Industrial </div>
            <p>This is a template designed by free website templates for you for free you can replace all the text by your own text.</p>
          </div>
          <div class="clear"> </div>
          <p class="more"><a href="http://www.free-css.com/">View Details</a></p>
        </div>
      </div>
      <div class="clear"> </div>
      <div id="spacer"> </div>
    
        <div id="copyright"> Propertyadsdirect.com</a></div>
        <div id="footerline"></div>
      </div>
    
    </body>
    </html>
    The css is
    HTML Code:
    #right {
      float: right;
      width: 550px;
      padding-right: 9px;
      padding-top: 150px;
    }
    #right h2 {
      font: 18px arial, sans-serif;
      color: #BE8B06;
      border-bottom: 1px solid #C4AE7C;
      padding-bottom: 6px;
      margin-bottom: 1em;
    }
    #right h3 {
      font: 14px arial, sans-serif;
      color: #BE8B06;
      border-bottom: 1px solid #C4AE7C;
      padding-bottom: 6px;
      margin-bottom: 1em;
      margin-top: 2em;
    }
    #welcome {
      margin-right: 20px;
    }
    #profile {
      margin-right: 16px;
    }
    #right .left {
      margin-right: 18px;
    }
    #right .more {
      font-weight: bold;
      font-size: 10px;
    }
    The screen is split into two parts. If I have the form in the left side it works but if it is in the right side it does not.

    No ide what is missing. Can anyone help please

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't know if this has anything to do with it, but your table markup is invalid. (Not that I know why there's a table in the first place, since it's not tabular information and it's got only one row with one cell in it.)

    In this line,
    Code HTML4Strict:
    <table align="center"width="410" border="0"  padding="0" >
    there must be at least one white-space character before the width attribute. You can't have an attribute name that sticks to the preceding attribute value, there must be space between them.

    Also, you have a <label for="town">, but there is no <input id="town">. You need to add the id attribute to your text field to make the label work. (This shouldn't make the cursor disappear, though.)
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    I've seen this happen on a few other sites, and I want to say it's an IE problem, but my memory is anything but reliable. Agreed that there's no need for a table-based structure.

    Off Topic:

    Hi, Tommy!

  4. #4
    SitePoint Enthusiast paramedic's Avatar
    Join Date
    Oct 2007
    Posts
    76
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Unhappy

    Hi.
    since putting this thread om I have changed to using css to lay out the form. I still cant get a cusor on the screen. If I remove the div id = right it works as the form is on the left of the screen but if I put it back and move the form right the cursor disappears. I know the code I am using works as I am using an existing code.

    Any further ideas guys?

  5. #5
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,276
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    My initial thoughts when you said placement on the page affected whether or not you could place the cursor made me think of this:

    either the form elements aren't really where you think they are (where you see them isn't where they are)
    or
    someone (who is invisible) is sitting over the form.

    This someone could be a relatively-positioned or even absolutely positioned box.

    If you have a "bare page" with just
    doctype
    html
    head
    title
    style tag and internal styles for #right
    /head
    body
    just the div called #right and everything inside it
    /body
    /html

    I'll bet the inputs are clickable-- if they aren't, then finding out why will be pretty easy, because the bare page can't possibly have many reasons for it.

    BTW which browsers can't click on the inputs, or is it all of them?

    I've run into issues with Layout-Gala-style sidebars if I didn't add position: relative to that floated wrapped-up-with-a-negative-margin sidebar but only in Safari and I think FF. Opera and IE didn't notice a thing. Links weren't clickable or hoverable.

    That one would fall into the category of "it's not where you visually see it"... there, the sidebar wasn't really bringing its contents along (my guess, I'm not sure on the mechanics of negative margins on floats like that).

  6. #6
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Does the markup validate? I mean the whole page?

    Some errors, like duplicate IDs, can wreak havoc with forms.

    If it's an IE-only problem, look for other elements that may overlay the form inputs. You can try setting a garish background colour on suspect elements to see if they extend, invisibly, over the form.
    Birnam wood is come to Dunsinane

  7. #7
    SitePoint Enthusiast paramedic's Avatar
    Join Date
    Oct 2007
    Posts
    76
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi guys

    I took everything out and just put one input between the right id and it worked. When I first got the template I altered the dimensions of the menu etc. I will go back and use the original template and add the form and see if it works.


    Many thanks
    I will let you know what happened.


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
  •