!!!!urgent!!!!

Discussion in 'HTML & Website Design' started by IdeaGod, Feb 10, 2008.

  1. #1
    [​IMG]

    How do I get the text and textboxes to align instead of looking so off and sloppy?

    How do I make them look like this:

    [​IMG]

    See how they are aligned evenly and mine aren't???

    How do I make the text and the textboxes aligned????
     
    IdeaGod, Feb 10, 2008 IP
  2. dwayne12

    dwayne12 Well-Known Member

    Messages:
    184
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    110
    #2
    Hi IdeaGod,

    A simple way for you to do this is to use tables.

    Create a table with 2 Columns and then a row for each input.

    Or perhaps you could just use a Wufoo HTML form builder: http://wufoo.com/

    That might be your best bet, you can make some really attractive forms.

    - Dwayne.
     
    dwayne12, Feb 10, 2008 IP
  3. IdeaGod

    IdeaGod Guest

    Messages:
    282
    Likes Received:
    10
    Best Answers:
    0
    Trophy Points:
    0
    #3
    I don't know how to use tables :(

    Can you give an example code in html?

    And is there a different way to align everything? There has to be.
     
    IdeaGod, Feb 10, 2008 IP
  4. dwayne12

    dwayne12 Well-Known Member

    Messages:
    184
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    110
    #4
    Well yeah there is, if you know how to use DIV's & CSS. But that would be extremely hard for you to do so.

    Like I said earlier just use Wufoo.

    http://www.wufoo.com

    You can make great forms on their and it's easy.

    - Dwayne.
     
    dwayne12, Feb 10, 2008 IP
  5. IdeaGod

    IdeaGod Guest

    Messages:
    282
    Likes Received:
    10
    Best Answers:
    0
    Trophy Points:
    0
    #5
    I need to use what I got I can't use anything else.

    There has to be a way to align the text and textboxes like the second image I showed with basic HTML code.

    If anyone can accomplish this please reply here or PM me.
     
    IdeaGod, Feb 10, 2008 IP
  6. YIAM

    YIAM Notable Member

    Messages:
    2,480
    Likes Received:
    240
    Best Answers:
    0
    Trophy Points:
    280
    #6
    
    <form method="#" action="#">
    <table>
     <tr>
      <td align="right">Name:</td><td><input type="text" name="name" /></td>
      <td align="right">Email:</td><td><input type="text" name="email" /></td>
     </tr>
    </table>
    </form>
    
    HTML:
     
    YIAM, Feb 10, 2008 IP
  7. flowmotion

    flowmotion Peon

    Messages:
    35
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    You can also use some simply css to make the text boxes a little sexier
     
    flowmotion, Feb 10, 2008 IP
  8. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #8
    http://stommepoes.nl/Tests/form.html

    I made that for someone else. Just View Source and you'll see the CSS too cause I have it in the <head> instead of externally.

    Basically, you have a set width on the form or the box around the form. You float either the labels left, following Tyssen's Legends of Style page, (I got that link from Dan Schulz), and give the labels a width large enough to fit all your words in a row. The inputs will follow cause they're inline anyway.

    You couldn't just give your labels widths as they are now, I think cause they're inline. If you made them display: block so you could set a height or width, then the inputs would be pushed beneath them. So floating them is a pretty good compromise. But each new label has to clear the float above it (or the div around the label-input pair can do it too), and that can be a problem if there's something else floated like a sidebar, so sometimes I use the set width of the form to force the next label to sit beneath at a new line.
     
    Stomme poes, Feb 11, 2008 IP