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 6 of 6
  1. #1
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts

    semantic code for radio buttons help.

    Hi,

    I have a 'column' of radio buttons but , as I have coded it, they don't align with each other on the vertical because they position themselves according to where their descriptive word ends.

    like this

    Code:
    <td class='rightTd'>
                <input type='hidden' name="file_sequence_1" value="1" /> 	
        	    <p>Text: <input type="radio" class='radio_button' name="text_or_list_1" checked='checked' value="text" /></p>
                <p>List: <input type="radio" class='radio_button' name="text_or_list_1" value="list" /></p> 
              </td>
    Tempted to put them into a table to lay them out better, I suspect that would be 'wrong'. How would you do it? <dl>, <ul> or does it really matter? It is only for use in a cms where a desktop or laptop would be used to view the pages - if that makes a difference, to your answer.

    bazz
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Code:
    <label>Text: <input type="radio" class='radio_button' name="text_or_list_1" checked='checked' value="text" /></label>
                <label>List: <input type="radio" class='radio_button' name="text_or_list_1" value="list" /></label>
    and then specifically set display:block; to these labels.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    Thanks Abduraooft.

    However, that only makes the display the same as when I used the <p> tags.

    I am trying to make the radio buttons align vertically with each other. here's am image, if I can work out how to publish it


    bazz
    Attached Thumbnails Attached Thumbnails semantic code for radio buttons help.-radio_images.jpg  
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link

  • #4
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,915
    Thanks
    6
    Thanked 1,040 Times in 1,013 Posts
    Quote Originally Posted by bazz View Post
    I am trying to make the radio buttons align vertically with each other.
    Then change the markup to this:
    Code:
    <label for="radio1">Text:</label> <input type="radio" id="radio1" class='radio_button' name="text_or_list_1" checked='checked' value="text" />
    <label for="radio2">List:</label> <input type="radio" id="radio2" class='radio_button' name="text_or_list_1" value="list" />
    And float the labels to the left (don’t forget to clear) and apply the same width to both of ’em.

  • #5
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,957
    Thanks
    9
    Thanked 727 Times in 721 Posts
    Something like:

    Code:
    <label>Text: </label><input type="radio" class='radio_button' name="text_or_list_1" checked='checked' value="text" />
    <label>List: </label><input type="radio" class='radio_button' name="text_or_list_1" value="list" />
    with

    Code:
    label{float:left;clear:left;width:100px}
    input{float:left}
    would work.

    EDIT: Ha, too slow....

  • #6
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    Thanks all of you. workin' a treat now.

    bazz
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link


  •  

    Posting Permissions

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