Edit Question - KnowledgeHub

Title Body

I have spent more time than I ever care to admit trying to fix this stupid bug. I have a form that displays to the left of some content. It looks okay on a wide and narrow screen, but on a tablet width (it overlays between 770 and 950 or so) the content to the right overlaps the form fields. Am I missing something in my markup to use Twitter Bootstrap properly or do I need to add some custom styles using breakpoints to fix it? It appears that the fixed pixel width is causing the issue defined in bootstrap.css. Shouldn't these width properties use % since I'm using a fluid responsive layout? <div class="container-narrow"> <div class="content"> <div class="row-fluid"> <div class="span5"> <form class="form-horizontal" id="applies-Step1-form" action="/" method="post"> <div class="control-group"> <label class="control-label required" for="Step1_email">Email <span class="required">*</span></label> <div class="controls"> <input size="60" maxlength="255" name="Step1[email]" id="Step1_email" type="text" /> </div> </div> <div class="control-group"> <label class="control-label required" for="Step1_home_zip">Home Zip <span class="required">*</span></label> <div class="controls"> <input size="5" maxlength="5" name="Step1[home_zip]" id="Step1_home_zip" type="text" /> </div> </div> </form> </div> <div class="span7"> <div class="promo-btm"> <h2>Heading 2</h2> <ul class="checks"> <li>Bullet One</li> <li>Bullet Two</li> </ul>

Tags (comma-separated) Cancel