I've attached an image of a layout for a site that I designed in PhotoShop. If you look at the Navbar you'll see that I've gave it a 'glossy/glasy' effect. Im new to web development, but I know there is no CSS on the planet that can do that. So how exactly do you get that effect on your web page using DreamWeaver?

The way I thought it might get done, is gaving the Navbar as an image behind the actual links. I could be wrong though...What do the experts say?

And please, the way of doing it in DreamWeaver CS5, I do not want to be manually coding this...

Oh yes! One more thing, you'll see there's lots of white space on the right of the web page design. Does anybody have suggestions of what to put there to fill up the page a bit? The company I'm doing the site for doesn't have content to put there so I'm rather clueless of what I can put the in there...

Edited by Dean_Grobler: n/a

Attachments Layout_copy.png 217.95 KB
7 Years
Discussion Span
Last Post by Dean_Grobler

You would have to use CSS

Just add a div to your navigation and repeat a background image


<div class="navigation">
  <li>item 1</li>
  <li>item 2</li>
.navigation {
 width: 800px;
 height: 20px;
 background: url(../images/YourImage.jpg) repeat-x; /*save your image as 1x20 jpg*/

How big should this image be roughly? The exact length and width of my Navigation bar or something smaller?

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.