Form label ID's...

Discussion in 'HTML & Website Design' started by Matt Ridge, Sep 19, 2011.

  1. #1
    Ok, I have been thinking over the weekend, while tearing up rugs that were older than me... I need to run this through people here to see if this is possible...

    I have a forum, can you create an id for a label and input so they can move individually?
    I am looking to make a field that shows three rows down, two beside them, and five below the two in the middle.

    But I want this to be all one form...

    Is this possible?
     
    Matt Ridge, Sep 19, 2011 IP
  2. workingsmart

    workingsmart Well-Known Member

    Messages:
    411
    Likes Received:
    12
    Best Answers:
    9
    Trophy Points:
    120
    #2
    First off, you have a FORM not a FORUM... lol... You keep throwing me with that one... lol

    What do you mean ===> Move Individually?....

    You can put 15 pages of fields all in one form... doesn't matter, but please be a bit more descriptive as to what you are trying to do or accomplish...

    Thanks!! :)

    Happy Monday!!
     
    workingsmart, Sep 19, 2011 IP
  3. Rukbat

    Rukbat Well-Known Member

    Messages:
    2,908
    Likes Received:
    37
    Best Answers:
    51
    Trophy Points:
    125
    #3
    You can just put text where you want it and input elements where you want them. The label is just something showing to the user. The only difference with using a label is that if the element is binary (like a checkbox or radio button), clicking the label has the same effect as clicking the element. Which is something you don't want if the label isn't next to the element.

    So you can have
    
    <form action="myfile.php" method="post">
    These are my text inputs<br />
    The first one is your first name<br />
    The second one is your last name<br />
    The third one is your email address<br />
    <input type="text" id="text1" /><br />
    <input type="text" id="text2" /><br />
    <input type="text" id="text3" />
    </form>
    
    HTML:
     
    Rukbat, Sep 19, 2011 IP
  4. workingsmart

    workingsmart Well-Known Member

    Messages:
    411
    Likes Received:
    12
    Best Answers:
    9
    Trophy Points:
    120
    #4
    Matt, I just reread your question... You CAN individually ID or create separate classes to move them around for layout purposes individually...

    
    <label for="name" class="samestuff namefield">Name:</label><input type="text" name="name" size="30" value="" />
    <label for="email" class="samestuff emailfield">Email:</label><input type="text" name="email" size="30" value="" />
    
    Code (markup):
    CSS

    
    .samestuff {
    font-size: 12px;
    font-weight: 600;
    color: #333;
    }
    
    .namefield {
    float: left;
    margin: 0px;
    }
    
    .emailfield {
    float: right;
    margin: 10px 10px 0px 0px;
    }
    
    Code (markup):
    Can put them in groups too...

    
    <fieldset class="set1">
    <label for="name" class="samestuff namefield">Name:</label>
    <input type="text" name="name" class="namefield" size="30" value="" />
    </fieldset>
    <fieldset class="set2">
    <label for="email" class="samestuff emailfield">Email:</label>
    <input type="text" name="email" size="30" value="" />
    </fieldset>
    
    Code (markup):
     
    Last edited: Sep 19, 2011
    workingsmart, Sep 19, 2011 IP
  5. Matt Ridge

    Matt Ridge Peon

    Messages:
    166
    Likes Received:
    0
    Best Answers:
    1
    Trophy Points:
    0
    #5
    Ok, but now comes an interesting question... at least I think so...

    can this be done, and still have it where there is only one submit button?

    I mean by doing the fieldset class... which honestly I've never seen... what does it actually do?
     
    Matt Ridge, Sep 19, 2011 IP