1 Reply Latest reply on Feb 29, 2012 1:47 PM by urban-tiger

    issue with floating divs

    future-architect Level 1

      I am having trouble with this layout.  it seems that the two divs that float at the bottom are not staying in the main, parent div.

       

      <div style="width:700px; margin-left:auto; margin-right:auto;">

        <p><img src="website/public_html/images/support_center_logo.png" width="222" height="34" style="padding-left:10px;" /></p>

        <p>

        <div style="

      text-align:right; padding:3px;">

        Nav goes here

        </div>

        <div style="padding:5px;">

        <span style="color:#99CC00; font-size:18px; font-weight:500;">Welcome!</span><p>

        Text here

        <hr />

       

        <div style="width:280px; padding:10px; display:inline; float:left;">

        <div style="font-weight:bold; color:#0033CC;">Open a New Ticket</div>

        <divs>

          <p>box one here</p>

          <form id="form1" name="form1" method="post" action="">

            <input type="submit" name="Open New Ticket" id="Open New Ticket" value="Open New Ticket" />

          </form>

          <p> </p>

        </div></div>

       

        <div style="width:280px; padding:10px; display:inline; float:right;">

        <div style="font-weight:bold; color:#0033CC;">Check Ticket Status</div>

        <div>

          <p>box two here</p>

          <form id="form1" name="form1" method="post" action="">

            <label for="ticketID">Ticket #: </label>

            <input type="text" name="ticketID" id="ticketID" /><p>

            <input type="submit" name="Open New Ticket" id="Open New Ticket" value="openNewTicket" />

          </form>

        </div>

        </div>

        </div>

      </div>