Solved

IE7 / 8 Compatibility mode TABLE / CSS / FORM issue

Posted on 2009-06-29
2
975 Views
Last Modified: 2012-05-07
You need (ideally) IE7 or 8 (the one I am using) to see this rather bizarre issue.

Go to www.pinkanddizzy.com and click on registration (there is NO need to register any details to see this issue). This webworks best in IE6, as the menu to the left displays properly in this browser. However in IE7 and 8 the menu is .. well broken.

However, when in compatibility mode, it is not possible to click inside the first half of the forms in the registration form. See for youself.. visit the site using IE8 without compatibility mode.. click registration then click inside the field FIRST NAME... easy...

now click the compatibilty mode button (watch the menu now display correctly..) now try to click anywhere in the first HALF of the FIRSTNAME box.. you cant... move the mouspointer along the field.. and after about half way the cursor changes to the text one.

Any ideas welcome.. there is no major java or codnig at work in this very basic form.
0
Comment
Question by:mvwmail
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 30

Accepted Solution

by:
IanTh earned 500 total points
ID: 24740545
I think its because your using tables
dont ie 7 and 8 dont like them

I use on forms


<form action="sendmail.php" method="post" name="form1" class="form">
      <fieldset class="fieldset">
        <input name="form:" type="hidden" id="hidden Field" value="contact us" />
        <span id="sprytextfield1">
        <label for="name" class="label">Name</label>
        <input type="text" name="name" class="field" id="name" />
        <span class="textfieldRequiredMsg">A value is required.</span></span><br />
        <span id="sprytextfield2">
        <label for="email address" class="label">Email Address</label>
        <input type="text" name="email address" class="field" id="email address" />
        <span class="textfieldInvalidFormatMsg">Invalid email address.</span></span><br />
        <span id="sprytextfield3">
        <label for="phone number" class="label">Phone Number</label>
        <input type="text" name="phone number" class="field" id="phone number" />
        <span class="textfieldRequiredMsg">A value is required.</span></span><br />
        <span id="sprytextarea1">
        <label for="message" class="label">Message</label>
        <textarea name="message"  class="field" id="message" cols="45" rows="5"></textarea>
        <span class="textareaRequiredMsg">A value is required.</span></span> <br />
       
        <p>
          <label for="submit"></label>
          <input name="submit" type="submit" class="button" id="submit" value="Submit" />
          <label for="reset"></label>
          <input name="reset" type="submit" class="button" id="reset" value="Reset" />
          <br />
        </p>
</fieldset>

and it works in ie 7 and 8 no problem
0
 
LVL 3

Author Closing Comment

by:mvwmail
ID: 31598074
Taking the form out of the table didnt work.. I got around the issue by just using one column instead of two.

Thanks for trying anyway
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
Password hashing is better than message digests or encryption, and you should be using it instead of message digests or encryption.  Find out why and how in this article, which supplements the original article on PHP Client Registration, Login, Logo…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…

696 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question