Advanced Search Usage Terms Submit Contact
Dynamic Drive CSS Library

CSS Library: Form CSS: Here

Responsive 2 column form

Author: Dynamic Drive

This is a clean, two column form that's also responsive, turning into a single column spanning the entire width of the page when the window's size is 480px or less. The two column design and large controls are meant to make the form more inviting to fill out, by breaking up the text input fields into two columns, thus appearing less overwhelming to complete. Beautiful forms equate to inviting forms!

Click here to see the form in a liquid layout, then try resizing the browser window to 480px or less. Notice the responsive layout of the form.

Sex:
  • Male:
  • Female:
Skills:
  • JavaScript:
  • CSS:
  • PHP:
  • Ruby:
  • Python:

The CSS:

The HTML:

Code Info

Rate this code:

Date Posted: 02/04/2015

Revision History: None

Usage Terms: Click here

Your Comments
Copyright 2006-2016 Dynamic Drive