Doing my first website with Couch.
I have most of the website coded in html/css
I have a slightly different menu structure.
Please see the uploaded image.
I am looking at the menu tag reference.
But want to know whether it would be possible.. sorry if I am missing something
The HTML is:
etc..
The CSS is as follows:
The top menu list items are replaced with background-images (class cl1, cl2 etc)
Kindly help. Thanks a lot in advance.
I have most of the website coded in html/css
I have a slightly different menu structure.
Please see the uploaded image.
I am looking at the menu tag reference.
But want to know whether it would be possible.. sorry if I am missing something
The HTML is:
- Code: Select all
<ul class="mainnav">
<li><a class="cl1" href="#"><span>Main1</span></a></li>
<li><a class="cl3" href="#"><span>Main2</span></a>
<ul>
<li><a href="#">Sub1</a></li>
<li><a href="#">Sub2</a></li>
<li><a href="#">Sub3</a></li>
</ul>
</li>
<li><a class="cl2" href="#"><span>Main3</span></a></li>
.....etc..
etc..
The CSS is as follows:
- Code: Select all
.mainnav { list-style: none; list-style-type: none; text-align: left; }
.mainnav li { float: left; display: inline; list-style-type: none; }
.mainnav li a { display: block; width: 100px; height: 50px; float: left; background-image: url("../images/mainnav.gif"); }
.mainnav li ul li a {background-image: none;}
.mainnav a span { display: none; }
.mainnav li ul { position:absolute; visibility:hidden; width: 120px;}
.mainnav li ul li { display:inline;}
.mainnav li ul li a, .mainnav li ul li a:visited {width: 120px; height: 30px; background-color: #eee; color: #000; }
.mainnav li ul li a:hover { background-color: #ddd; color: #fff;}
The top menu list items are replaced with background-images (class cl1, cl2 etc)
Kindly help. Thanks a lot in advance.