Home

Just HTML and CSS

Demos of responsive html/css

Resize the demo screens to see the responsive results.

Rainbow layouts have been used to help you track the positioning of different html elements on your own.

  1. Single Level: Demo; Source files
  2. Multi-level (Dropdown): Demo; Source files
  3. Vertical Dropdown: Demo; Source files

Responsive Content

Rainbow layouts to help track the positioning of the different html elements.
(How to use Rainbow layouts)

  1. 2 Columns to 1 Column : Demo; Source files
  2. 3 Cols to 1 Col One: Demo; Source files
  3. 3 Cols to 1 Col Two: Demo; Source files

CSS Slideshows & Hamburgers

  1. Slideshow with controls: Demo; Source files
  2. Automatic transitions: Demo; Source files
  3. Hamburger X: Demo; Source files

Contact Us type pages

One option for a "Contact Us" page is to use a form to send an email to yourself.

Using only HTML can work, but only with certain browsers and if the browser settings are set to allow this to happen.

A method that will always work is to have PHP do the delivering of the email for you. To test this, you will need to upload the files to your server which has PHP installed or XAMPP localhost.

  1. Contact Us 1: Demo; Source files