|
|
Posted by jojo on 10/31/32 11:53
Lesley Blakey wrote:
> 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.
Yes, you can post it here.
> I have created a horizontal menu bar and a vertical menu (using a table)
If you are already using CSS, why don't you do your menu with CSS than?
> 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.
Post a link so everybody can see how it looks? And perhaps an image how
it *should* look?
> 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}
ASFAIK this is not necessary. Correct me if I'm wrong, but I think <li>
is already inline by default?
BTW: Why do you use a list if you don't want it to look like one?
> <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">
Try to avoid mixing up CSS and styling within HTML. Why don't you style
the table per CSS? Try this:
table {
position: relative;
/*
So the table is styled relative to the last element with
"position:absolute;", the <div> in your case. Maybe *this*
solves your problem
*/
width: 100%;
border: 1px solid black;
background-color: white;
padding: 0px;
margin: 0px;
}
td, th {
padding: 0px;
margin:0px;
}
>
> <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>
HTH, jojo
Navigation:
[Reply to this message]
|