Input - looks good in FF, but not in IE...?

If claiming that code

Posted: Sat, 2008-10-11 18:01

If claiming that code validates it's wise to ensure that it actually does

<center><form method="get"
      action="http://groups.yahoo.com/subscribe/HotProxies"
      style="width: 470px;">
  <h6 style="font-weight: bold; margin-bottom: 5px; text-align: center">
      <font size="2">Unblocked Proxies In Your Inbox? 100% SPAMFREE</font></h6>
  <input style="vertical-align: top"
      type="text"
      name="user"
      value="Enter mail here, click Yahoo"
      size="27" />
  <input type="image" alt="Click to join HotProxies"
      name="Click to join HotProxies"
      src="http://i36.tinypic.com/21ex0l0.png" /></p>  
</form></center>

Fix this up then revisit the page if the problem still exists post acknowledgement and we will look further, until then with markup errors there is little point.

Whilst on the subject of markup there are several elements you are using that really shouldn't be used; loose the <center> tag and the <font> tag and don't use the <br> tag just to force spacing thats what the margin property is for.

Well actually I see more

Posted: Sat, 2008-10-11 19:44

Well actually I see more extreme problems, when stating a problem occurs in a browser you need to state the version especially where IE is concerned.

well done for getting rid of those deprecated elements.

In IE6 you have a clearing problem due to IE6 incorrectly handling elements with a width that follow after floated elements, due to the width placed on div#yahoo and #content they are dropping below the floated sidebars. With this type of layout it's not necessary to apply a width to the central column, simply apply margins that push it's edges away from the sidebars, do this on both elements or bring the yahoo din into #content.

If you do some checking

Posted: Sun, 2008-10-12 05:36

If you do some checking you'll find that if the width on the parent div of that input is removed then IE behaves as expected, that tells us hasLayout has been triggered on the element and is causing problems, the solution therefore is to move the width you need either to an element a node above that div or try setting the width on the input, I'll leave you to figure out the best approach.

Be careful setting dimensions, they may be needed at times but can have consequences, where possible always try and avoid setting width unless there is a very definite reason and then check that is hasn't cause unwanted behaviour.

I note that in fact you did not follow the advice to remove width on the central column instead choosing to float it, that's fine it sorts things out, but if taking that approach you might as well move that column higher in the source code.

Well you appear to be doing

Posted: Sun, 2008-10-12 11:49

Well you appear to be doing fine despite my advice so I'll let you continue as it seems you are almost home and dry, it shouldn't be hard to sort the positioning of that element out now.

Well, the problem is fixed.

Posted: Sun, 2008-10-12 16:42

Well, the problem is fixed. A friend of mine told me to add a line of code to the style.css and that did it.

Thanks again for your help and explanation of these things.