Free Vertical Header Template

Difficulty Rating :
Written byAires DaGraca

This is a vertical header template I built just to see how hard it would be.  The template is built with 2 columns and some crafty CSS which you can find in each of the columns.

I have seen other comment about various ways to accomplish this but this way seemed to be the best.

The template was built with mobile first in mind so there is a Template Widget hidden in the vertical menu side of the template. You may need to open the navigator to access it.

You will need to use the template widget to hold your mobile header that you will need to create. 

Things to remember 

Ideally you would want to add this to a black page with no header or footer so things fill the page. Also note that the left column has a html tag of header and the right has the html tag of main for semantic purposes.

Alternative Addons

If you want build you own Crocoblock has a neat little feature that allows you to sticky columns with ease.

Enjoy 😀.

Was this article helpful?

Awesome, follow us on Twitter or Like us on Facebook

Disclosure: Some of the links above are affiliate links meaning at no additional cost to you, I will earn a commission if you click through and make a purchase.

Leave a Comment

Your email address will not be published. Required fields are marked *

By visiting you accept our use of cookies and agree to our privacy policy.

Hello, would you like to take a survey before you leave.

Your answers will help us provide more and useful content.
Thank you for your time.