Honeypot field breaking entire page - html

Question

I have a honeypot ('Work Phone') field in a simple contact form. I am hiding (hacking) the element by positioning it fixed and -1000% off the screen.
The form HTML:
<aside class="enquiry-form">
<h3 class="heading">Enquire Now</h3>
<form id="EnquiryForm_EnquiryForm" action="/products/filtered-water-taps/EnquiryForm" method="post" enctype="application/x-www-form-urlencoded">
<div class="inputs">
<input type="text" name="Name" class="text" id="EnquiryForm_EnquiryForm_Name" required="required" aria-required="true" placeholder="Name" />
<input type="email" name="Email" class="email text" id="EnquiryForm_EnquiryForm_Email" required="required" aria-required="true" placeholder="Email" />
<input type="text" name="Work Phone" class="text" id="EnquiryForm_EnquiryForm_Work-Phone" style="position: fixed; left: -1000%;" tabIndex="-1" />
<input type="text" name="Phone" class="text" id="EnquiryForm_EnquiryForm_Phone" required="required" aria-required="true" placeholder="Phone" />
<input type="text" name="Product" value="Filtered Water Taps" class="product" id="EnquiryForm_EnquiryForm_Product" placeholder="Product" />
</div>
<div class="message">
<textarea name="Message" class="textarea" id="EnquiryForm_EnquiryForm_Message" required="required" aria-required="true" placeholder="Message" rows="5" cols="20"></textarea>
</div>
<input class="button dark" type="submit" value="Send" />
</form>
</aside>
The problem is, in ie8 the whole page breaks and I get a white screen, I cannot inspect the element using dev tools which makes debugging very dfficult.
My gut feel is that it has something to do with html5shiv.
Any help is appreciated.

Answer 1

I would suggest this method:
#EnquiryForm_EnquiryForm_Work-Phone {
position: absolute;
top: -9999px;
left: -9999px;
}
By the way, I think its better to use a "website" as honeypot field. This is something a spambot allways want's to fill out.