|
|
Posted by Lesley Blakey on 11/26/04 11:53
Hi
I am a bit of a novice dreamweaver user and would appreciate a little help
with css. I hope this is the correct newsgroup, if not can someone point me
to the right one.
I have created a horizontal menu bar and a vertical menu (using a table)
using the code below. The vertical menu bar is 20% wide and I want the menu
choices to be 100% of this. However, when I apply 100% to the vertical menu
bar, the atrtibutes then apply themselves to the horizontal bar as well,
which I don;t want. I can see than it's all to do how the "a" is defined as
both bars reference "a href". Is there a work around this. Hope what I
have said makes sense. Will try and explain a bit better if needed.
Thanks in anticipation
Lesley
horizontal
-----------
ul
{
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}
a
{
float:left;
width:6em;
text-decoration:none;
color:white;
background-color:purple;
padding:0.2em 0.6em;
border-right:1px solid white;
}
a:hover {background-color:#ff3300}
li {display:inline}
<ul>
<li><a href="#">Link one</a></li>
<li><a href="#">Link two</a></li>
<li><a href="#">Link three</a></li>
<li><a href="#">Link four</a></li>
</ul>
--------------------
vertical
-------
div.container_leftmenu
{
width:19%;
margin:0px;
border:1px solid gray;
line-height:150%;
position:absolute;
left:10px;
top:270px;
background-color:#FFFFFF;
}
<div class="container_leftmenu">
<div class="left"><table width="100%" border="1" cellpadding="0"
cellspacing="0" bgcolor="white">
<tr>
<td><a href="link_a.htm">Link A</a></td>
</tr>
<tr>
<td><a href="link_b.htm">Link B</a></td>
</tr>
<tr>
<td><a href="link_c.htm">Link C</a></td>
</tr>
</table>
Navigation:
[Reply to this message]
|