Forum Moderators: not2easy
first, in netscape 6.0, i ve some text but it cant not display the color as i expected. However, it is ok in ns4.75 even older version. Whats the bug?
second, the text cannot align correctly by "justify" in netscape again. This happens strange too since sometime its ok
but sometimes cant work even for the same version of netscape!
How can i make them to be consistence?!..
..
ths a lot!
Michael
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=big5">
<link rel="stylesheet" href="master.css" type="text/css">
</head>
<body>
<table width="160" border="0" cellspacing="1" cellpadding="2" bgcolor="#FFFFFF">
<tr>
<td bgcolor="#330099" class="ab" align="center"> <a href="a.html" class="a_link">Test
Here </a></td>
</tr>
<tr>
<td bgcolor="#0066CC" class="menutxt" height="20"> <a href="b.html" class="menu_link">menu1</a>
</td>
</tr>
<tr>
<td bgcolor="#0066CC" class="menutxt" height="20"> <a href="c.html" class="menu_link">menu2</a>
</td>
</tr>
<tr>
<td bgcolor="#0066CC" class="menutxt" height="20"> <a href="d.html" class="menu_link">menu3</a>
</td>
</tr>
<tr>
<td bgcolor="#0066CC" class="menutxt" height="20"> <a href="e.html" class="menu_link">menu4</a></td>
</tr>
<tr>
<td bgcolor="#3399FF" class="submenutxt"> <a href="f.html" target="_blank" class="submenu_link">submenu</a></td>
</tr>
<tr>
<td bgcolor="#3399FF" class="submenutxt"> <a href="g.html" target="_blank" class="submenu_link">submenu</a>
</td>
</tr>
<tr>
<td bgcolor="#0066CC" class="menutxt" height="20"> <a href="h.html" class="menu_link">menu5</a>
</td>
</tr>
<tr>
<td bgcolor="#99CCFF" class="bluesmallword"> strange<a href="i.html" target="_blank" class="darkbluelink">
here</a> as it is <a href="k.html" class="darkbluelink">here</a>. </td>
</tr>
</table>
</body>
</html>
this is the css code in a separated file..
/* left menu */
.ab {
color: #ff9900;
font-size:15px;
font-weight:bold;
font-family: "Arial", "Helvetica", "sans-serif";
text-decoration:none;
}.a_link:link, .a_link:visited {
color: #ff9900;
text-decoration:none;
}
.a_link:hover, .a_link:active {
color: #cc0000;
text-decoration:none;
}
.menutxt {
color: #ffffff;
font-size:13px;
font-weight:bold;
font-family: "Arial", "Helvetica", "sans-serif";
text-decoration:none;
}
.menu_link:link, .menu_link:visited {
color: #ffffff;
text-decoration:none;
}
.menu_link:hover, .menu_link:active {
color: #000099;
text-decoration:none;
}
.submenutxt {
color: #000099;
font-size: 11px;
font-family: "Arial", "Helvetica", "sans-serif";
text-decoration:none;
}
.submenu_link:link, .submenu_link:visited {
color: #000099;
text-decoration:none;
}
.submenu_link:hover, .submenu_link:active {
color: #ffffff;
text-decoration:none;
}
.bluesmallword {
color:#0066cc;
font-size:11px;
font-family: "Arial", "Helvetica", "sans-serif";
text-decoration:none;
}
.darkbluelink:link, .darkbluelink:visited {
color: #000099;
text-decoration:none;
}
.darkbluelink:hover, .darkbluelink:active {
color: #000099;
text-decoration:none;
}
this problem happened in ns6.0
many ths!
It's best to start by stripping out redundancies. For example, you specify <td bgcolor="#0066CC" class="menutxt" height="20">
quite a few times, and yet you could simply include "background: #0066CC; height:20" into your style definition and then just use <td class=menutxt"> in the HTML body. Much simpler.
Furthermore you could perhaps define a class for your table, or put a div round it, and define the default link style to be the same as your menu_link, as the majority of your links are that style. Then you can remove the class="menu_link" from your <a> elements and only include a class for those which are not "menu_link" style. Those styles will override the default style "menu_link". The result will be a much shorter, and therefore more controllable and debuggable, style sheet.
It depends on how you want to layout your menu: rather than use a table, you coulduse DIVS to group the items of styles of menu (menu_link, submenu_link etc.) together, then you only specify the class for the DIV, not for every single link. Tables may be better for a starter, as positioning can be sometimes fiddly just using DIVs.
It's all about inheritance of styles from parent elements, etc. Once you've cut out all of the redundant style definitions and moved *all* the style information away from the body and into the stylesheet, it will be a lot easier to see what's going on!
Michael
