Vertical navigation background color

**larseneau** · 10-24-2012 12:23 PM

I have two navigation menus...vertical and horizontal. I need different background colors for them. I can't seem to get the background color for the vertical navigation menu. Any help would be appreciated. Thank you.

**cbVision** · 10-24-2012 04:16 PM

Can you post a link or code?

**larseneau** · 10-28-2012 06:03 PM

Originally Posted by cbVision

Can you post a link or code?

<body>

<header>
<h1><img src="mwulogo.png" alt="Midwest University" /></h1>
</header>

<nav class="horizontal">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Courses</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Terms of Use</a></li>
<li><a href="#">Feedback</a></li>
<li><a href="#">Help</a></li>
</ul>
</nav>

<nav class="vertical">
<h4>Course Outline</h4>
<ol>
<li><a href="#">The Road to War</a>
<ol>
<li><a href="#">Planting the Seeds</a></li>
<li><a href="#">The First Crisis</a></li>
<li><a href="#">Compromise & Failure</a></li>
<li><a href="#">Fault Lines</a></li>
</ol>
</li>
<li><a href="#">Politicians & Generals</a>
<ol>
<li><a href="#">Politicians</a></li>
<li><a href="#">Generals</a></li>
</ol>
</li>
<li><a href="#">The Course of War</a>
<ol>
<li><a href="#">1861-1862</a></li>
<li><a href="#">1863</a></li>
<li><a href="#">1864-1865</a></li>
</ol>
</li>
<li><a href="#">Aftermath</a>
<ol>
<li><a href="#">Lincoln Assassination</a></li>
<li><a href="#">Reconstruction</a></li>
<li><a href="#">A New Constitution</a></li>
<li><a href="#">The United States Is ...</a></li>
</ol>
</li>
</ol>
</nav>

/* Navigation list styles */

nav ul {
font-famiy: Century Gothic MS, sans-serif;
font-size: 14 px;
font-weight: bold;
letter-spacing: 3 px;
line-height: 20 px;
}

nav ul li a {
text-decoration: none;
}

li a:hover {
color: hsl(212, 100%, 29%);
}

**cbVision** · 10-29-2012 11:09 AM

They both look vertical using that code:
http://jsfiddle.net/DECWs/

Also, you don't have background defined at all.

I added two lines for backgound color seen here:
http://jsfiddle.net/DECWs/1/

**larseneau** · 10-30-2012 09:05 AM

I need to set the background color to the vertical navigation section to hsl(32, 100%, 95%)

This is the CSS from the cw_layout

**larseneau** · 10-30-2012 09:17 AM

nav.horizontal ul {
display: block;
width: 950px;
height: 20px;
}

nav.horizontal ul li {
display: block;
float: left;
text-align: center;
width: 150px;
}

nav.vertical {
clear: left;
float: left;
margin-right: 0px;
width: 300px;

}

**larseneau** · 10-30-2012 09:18 AM

I have fixed it, but the color doesn't match up with my assignment...it looks white on the computer, but the book color looks tan.

Thread: Vertical navigation background color

Thread Tools

Display

Vertical navigation background color

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions