AgerNic.com
WEB DEVELOPER SITE, HTML, CSS, PHP, SQL
HTML Tutorial

Vertical CSS Menu Navigation


Web Template » Vertical CSS Menu Navigation

Simple vertical CSS HTML bar design is great for a minimalistic look and works well to give the user a simple navigation interface. Let's imagine that we are building an vertical sidebar compatible with all major browsers, no images or javascript.

How to create simple Vertical CSS Menu Navigation - examples


A navigation bar is one of the main components of a website, in my opinion the most important one, it is in fact the first section that the user sees when he/she enter a website and it links to the other main partsof your website.

You will be able to build your site as a professional, without technical or coding knowledge! ... Choose a template created by a designer or create a Horizontal CSS HTML Navigation Bar from scratch.

Example:
Example, How to create simple Vertical CSS Menu Navigation - examples:
        

<!DOCTYPE html>
<html>
<head>
<style>
.menu_simple ul {
margin: 0;
padding: 0;
width:185px;
list-style-type: none;
}

.menu_simple ul li a {
text-decoration: none;
color: white;
padding: 10.5px 11px;
background-color: #005555;
display:block;
}

.menu_simple ul li a:visited {
color: white;
}

.menu_simple ul li a:hover, .menu_simple ul li .current {
color: white;
background-color: #5FD367;
}

</style>
</head>
<body>

<div class="menu_simple">
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
<li><a href="#">Link 5</a></li>
</ul>
</div>

</body> </html>



vertical css menu examples with source code HTML
Vertical CSS Menu Navigation - css menu

Online Editor
ONLINE EDITOR

news templates


COLOR PICKER

news templates
This tool makes it easy to create, adjust, and experiment with custom colors for the web.


HTML Templates
news templates
Magnews2 is a modern and creative free magazine and news website template that will help you kick off your online project in style.


CSS HTML Layout
news templates
Find here examples of creative and unique website layouts.


Free CSS HTML Menu
news templates
Find here examples of creative and unique website CSS HTML menu.


0
Online Editor
ONLINE EDITOR

news templates


COLOR PICKER

news templates
This tool makes it easy to create, adjust, and experiment with custom colors for the web.


HTML Templates
news templates
Magnews2 is a modern and creative free magazine and news website template that will help you kick off your online project in style.


CSS HTML Layout
news templates
Find here examples of creative and unique website layouts.


Free CSS HTML Menu
news templates
Find here examples of creative and unique website CSS HTML menu.