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: Tabless forms

  1. #1
    New Coder twistedsoul's Avatar
    Join Date
    Jul 2008
    Location
    UK
    Posts
    94
    Thanks
    3
    Thanked 1 Time in 1 Post

    Tabless forms

    hi, I'm having trouble with this one here. I've not made a form before using just css always with tables, I've tried a few tutorials but not managed to get it the way i wanted. Could anyone point me in the right direction so i can get my form looking somewhat like this.http://www.edit-studios.com

    Code:
    <form id="contact" method="post" action="#">
        
           <p>Your name<span class="required"> *</span><br />
              <input type="text" name="FirstName" size="50" />
              <br />
             <br />
             Your email <span class="required">*</span><br />
             <input type="text" name="Email" size="50" />
             <br />
             <br />
    Your web site<span class="style1"></span><br />
    <input type="text" name="Website" size="50" />
    <br />
    <br />
    Your company<span class="style1"></span><br />
    <input type="text" name="Company" size="50" />
    <br />
             <br />
            </p>
           <p>Your message <span class="required">*</span><br />
              <textarea name="Message" id="textInput" cols="60" rows="8"></textarea>
            </p>
    <p><br />
        <input type="submit" name="send" id="send" value="Send" />
        <input type="reset" name="Reset" id="button" value="Reset" />  
        <span class="required">*</span> <em>required fields</em></p>      
    </form>
    thankyou.

  • #2
    Regular Coder
    Join Date
    Oct 2007
    Location
    Glencoe, Ontario, Canada
    Posts
    340
    Thanks
    19
    Thanked 27 Times in 27 Posts
    can u give us a copy of the css code?
    Eric "PitbullMean" Melo
    Always Start your layout with*{border:0; margin:0; padding:0;}
    Be sure to Thank ALL Users who give assistance.

  • #3
    New Coder twistedsoul's Avatar
    Join Date
    Jul 2008
    Location
    UK
    Posts
    94
    Thanks
    3
    Thanked 1 Time in 1 Post
    I only have this so far for style

    Code:
    input {
     background-color: #141414;
     border: 1px solid #232323;
     font-family: Arial, Helvetica, sans-serif;
     font-size: 11px;
     color: #FFFFFF;
    }
    required {
      color: #B10C0C;
    }
    textarea {
     background-color: #141414;
     border: 1px solid #232323;
     font-family: Arial, Helvetica, sans-serif;
     font-size: 11px;
     color: #FFFFFF;
    }
    Nothing to position it yet becuase I couldn't get it right.

  • #4
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,928
    Thanks
    6
    Thanked 1,041 Times in 1,014 Posts
    Semantic code also applies to forms. The paragraph element doesn’t make any sense whatsoever. Use divs for that or a list as described on http://alistapart.com/articles/prettyaccessibleforms. That article actually explains everything you need to know. However, one more thing: don’t use line breaks (br element). You almost never need this element to achieve what you want.


  •  

    Posting Permissions

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