Question

I’m roughing a layout together and doing some browser testing. Never came across this issue before, check out the contact form in the footer of this page

http://staging.terrilynn.com/fundraising/

There is a div with a width of 298px floated to the right that comes first in the source order. It is followed by several other divs, each with their child form elements floated left.

The div’s that should appear to the left of right-floated message div are disappearing.

Page displays correctly in firefox. Any help would be appreciated.

<div id='footer-contact-form'>   <h1>Request Information <span class='note'>(all fields required)</span></h1>   <form class='monkForm' method='post' action='http://my.ekklesia360.com/FormBuilder/handleSubmit.php' id='footer-info-request'>     <fieldset>       <legend>Footer Info Request</legend>       <div class='textarea required' id='w2376'>         <p class='data'>           <label for='area_2376'>Message</label>           <textarea id='area_2376' name='e_2376' rows='5' cols='20'></textarea>         </p>       </div>       <div class='text required' id='w2377'>         <p class='data'>           <label for='text_2377'>Name</label>           <input id='text_2377' type='text' name='e_2377' value='' />         </p>       </div>       <div class='text required' id='w2378'>         <p class='data'>           <label for='text_2378'>Phone</label>           <input id='text_2378' type='text' name='e_2378' value='' />         </p></div>       <div class='text' id='w2379'>         <p class='data'>           <label for='text_2379'>Email</label>           <input id='text_2379' type='text' name='e_2379' value='' />         </p>       </div>       <p id='formsubmit'><input type='submit' name='submit' value='Send' /></p>        <input type='hidden' name='token' value='8143f99c1d01b4d1207dbe7860e5586d' />       <input type='hidden' name='SITEID' value='2185' />       <input type='hidden' name='cpBID' value='367780' />       <input type='hidden' name='formslug' value='footer-info-request' />       <input type='hidden' name='CMSCODE' value='EKK' />       <input type='hidden' name='fkey' value='' />     </fieldset>   </form> </div><!-- #footer-contact-form --> 

Answer 1

I guess I found the problem:

screen.css (line 382)

#footer-contact-form div { margin:0 300px 10px 0; overflow:hidden; } 

‘overflow:hidden’ causes the problem.