A Sticky Footer Implementation Using Absolute Positioning

Button

Checkbox

Checkbox Label

Color (HTML 5)

Color Label

Date (HTML 5)

Date type allows for min and max range of dates. These values are set for days starting March 20, 2017 and ending February 17, 2019.

Date Label pick a date after March 20, 2017 and before February 17, 2019

Data Time Local (HTML5)

Date Time Local Label

Email (HTML 5)

Email Label

File

File Label

Hidden

Image

Month (HTML 5)

Month Label

Number (HTML 5)

Number Label (HTML 5, with max of 10, min of 1, default of 4, and 2 digit steps)

Password

Password Label

Radio

Radios

Radio One Label
Radio Two Label

Range

Range Label (HTML 5, with max of 10, min of 1, default of 4, and 2 digit steps)

Reset

Search (HTML 5)

Search Label

Submit

Tel (HTML 5)

Tel Label

Text

Text Label

Time (HTML 5)

Time Label

URL (HTML 5)

URL Label

Week (HTML 5)

Week Label

Vanilla Text Input with Readonly Set (Should only be used on textboxes)

Readonly Label

Vanilla Text Input with ARIA-Readonly Set (Note: ARIA-Readonly Should Not Be Used On Native Inputs)

Readonly Label

Here is our footer and a couple of buttons

Button One Button Two

Bonus, HTML 5 Autocomplete Using Datalist

Choose a browser from this list:

Single Select

One option disabled and one default selected

Select Label One One Two Three Four

Multi-Select

Multi-selectable with some internal options and an option group disabled. Size is set to display eight options at a time. To select more than one option, use Control + Spacebar.

Select Label Two Option One Option Two (disabled) Group One Option Group One Option Two (disabled) Group One Option Three Option Three Group Two Option One Group Two Option Two Group Two Option Three Option Four