Как создать контактную форму без использования таблицы?

Question

Я хочу сделать контактную форму для своего сайта. Я хочу сделать это, не используя таблицу. Как мне это сделать? Я смотрел на теги div, потому что хочу стилизовать его с помощью CSS. Я хочу дать ему длину и ширину. Я хочу поместить его в основной тег div, но я не уверен, как это сделать. Пожалуйста, помогите мне. Как мне это сделать?

Answer 1

Попробуйте найти в Google: «контактная форма CSS».

вы получите так много примеров с кодом при условии, что вы заблудились: D

Посмотрите на этих двух.

css-tricks.com

net.tutsplus.com

Надеется, что это помогает

Answer 2

Я использовал нечто похожее на this-

<form id="contact-form" name="contact-form" action="/contact-us" method="post"> 
    <div class="form-col"> 
     <input type="text" name="Requester.FirstName" class="styled" placeholder="First Name"> 
     <input type="text" name="Requester.LastName" class="styled" placeholder="Last Name"> 
     <div class="selector fixedWidth"> 
      <span>Subject</span> 
      <select name="Subject" class="styled"> 
      <option value="">Subject</option> 
      <option value="custserv">Customer Service</option> 
      <option value="vendor">Vendor</option> 
      <option value="other">Other</option> 
      </select> 
     </div> 
     <textarea name="message" class="styled"></textarea> 
    </div> 
    <div class="form-col"> 
     <input type="text" name="Requester.ContactInfo.Email" class="styled" placeholder="Email Address"> 
     <input type="text" name="Requester.ContactInfo.Phone" class="styled" placeholder="Phone Number"> 

     <span class="question">How do you prefer to be contacted?</span> 
     <label for="contact-method-phone"> 
      <div class="radio" id="uniform-contact-method-phone"><span><input type="radio" name="ContactMethod" id="contact-method-phone" value="HomePhone" class="styled"></span></div>Phone 
     </label> 
     <label for="contact-method-email"> 
      <div class="radio" id="uniform-contact-method-phone"><span><input type="radio" name="ContactMethod" id="contact-method-phone" value="Email" class="styled"></span></div>Email 
     </label> 
     <input type="text" name="Address.StreetAddress1" class="styled" placeholder="Address"> 
     <input type="text" name="Address.StreetAddress1" class="styled"> 
     <input type="submit" value="CONTACT US" class="m-form-button" name="CONTACT US"> 
    </div> 
</form> 

И я стараюсь следовать SMACSS при оформлении