Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4

Thread: Float Issue

  1. #1
    New to the CF scene
    Join Date
    Apr 2013
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Float Issue

    Hi guys,

    Bit stuck on something that should be relatively simple but isn't going my way unfortunately.

    I have a form with options and selectors that I am trying to get to sit opposite each other using floats. I have set the options to float left and the selectors to float right. However, although they are now set apart as I require, they are positioned with the selctors slightly lower than the options instead of being dead opposite each other.

    Any help would be much appreciated

    Website here:

    http://213.175.215.82/~biggacre/A6-Flyer-135GSM-D.Sided

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,642
    Thanks
    6
    Thanked 1,005 Times in 978 Posts
    First of all, it’s not called “option” and “selector”, it’s commonly called “label” and “field”. And that said, you have very bad HTML there. The labels (which you call “options”) should be <label> elements. This is more semantic and accessible. Then, the reason for the misalignments are the (unnecessary) line breaks (<br />); if you remove these the alignment will be OK.

    But still, you should convert all these <b> tags to labels. An example for one field:
    Code:
    <div class="option" id="option-13">
      <label for="otp_select_0"><span class="required">*</span> Quantity</label>
      <select name="option[13]" option="13" id="otp_select_0" class="otp_select swap13">
            <option selected="" value=""> --- Please Select --- </option>
            <option value="49">50</option>
            <option value="50">100</option>
            <option value="51">250</option>
      </select>
    </div>

  • #3
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,300
    Thanks
    28
    Thanked 275 Times in 269 Posts
    Quote Originally Posted by Dcypha Digital View Post
    I have a form with options and selectors that I am trying to get to sit opposite each other using floats. I have set the options to float left and the selectors to float right. However, although they are now set apart as I require, they are positioned with the selctors slightly lower than the options instead of being dead opposite each other.
    Easy enough: remove the br elements and unfloat the select elements.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #4
    New to the CF scene
    Join Date
    Apr 2013
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the help guys.

    I'm using a third party plugin for this and didn't realise they'd added <br> tags everywhere so i've removed them from the code.

    All working as it should now


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •