From 58f24d6c709100a59308b701e388446ff59d129a Mon Sep 17 00:00:00 2001 From: kjodle Date: Tue, 20 Oct 2015 18:10:07 -0400 Subject: [PATCH] Initial commit --- index.htm | 37 +++++++++++++++++++++++++++++++++++++ mobile.css | 17 +++++++++++++++++ styles.css | 45 +++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 99 insertions(+) create mode 100644 index.htm create mode 100644 mobile.css create mode 100644 styles.css diff --git a/index.htm b/index.htm new file mode 100644 index 0000000..624c04e --- /dev/null +++ b/index.htm @@ -0,0 +1,37 @@ + + + + + Responsive Forms + + + + + + + + + +
+ + + + + + + + + + + + + + + + +
+ +
+ + + \ No newline at end of file diff --git a/mobile.css b/mobile.css new file mode 100644 index 0000000..824aa39 --- /dev/null +++ b/mobile.css @@ -0,0 +1,17 @@ +/* HTML */ + +form { + border-top: solid 10px #ccc; + border-bottom: solid 10px #ccc; + padding: 2%; + margin: 0; + width: 96%; +} + +label { + width: 100%; +} +input { + width: 100%; + margin-bottom: 10px; +} diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..c9afd50 --- /dev/null +++ b/styles.css @@ -0,0 +1,45 @@ +/* Resets */ + +form, +label, +input { + margin: 0; + padding: 0; +} + +/* HTML */ + +form { + border: solid 1px #ccc; + border-radius: 12px; + padding: 10px; + margin: 10px auto; + width: 500px; +} + +label { + float: left; + text-align: right; + width: 190px; + clear: both; +} + +input { + float: right; + text-align: left; + width: 300px; + margin-bottom: 3px; +} + +input[type=number] { + width: 65px; + float: left; + margin-left: 6px; +} + + +/* Special Sections */ + +.clear { + clear: both; +} \ No newline at end of file