Forum Moderators: not2easy
But when i added general a formatting in the css, this formatting seem to override the a formatting on the div (the dotted bottom border and blue text color shouldn't be there).
The strange thing is, that on a:hover at least the correct a text color formatting seem to work on the div's.
The problem is, that i can't remove the general a formatting from the div's a formatting (removing the dotted bottom border and text color).
Any help will be highly appreciated!
<No URLs, thanks. See TOS [WebmasterWorld.com] and CSS Forum Charter [WebmasterWorld.com]>
CSS:
/*------------- Basic layout --------------*/
body {
/*background-image: url(img/bg.gif);
background-repeat: repeat;*/
background: #88a2b4 url(img/bg.gif) top left fixed repeat-x;
margin: 0px;/*main margin, frame*/
padding:0px;/* set margin in Opera*/
border:0px;
text-align: center;/*center layout - IE*/
font-family: verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 70%;
}
#container {
background: #f3f2ed url(img/container_bg.jpg) repeat;
color: #333;
margin:0px auto;/*centrerer layout i mozilla/opera*/
padding: 3px 10px 3px 10px;
/*border-top: 3px solid #f3f2ed;*/
width: 744px; /* bmh */
height: auto;
voice-family: "\"}\"";
voice-family:inherit;
width: 742px;
text-align:left;
}
html>body #container {/* hack set width in Mozilla, Opera*/
width: 724px;
}
#main_wrapper {
width: 100%;
background-image:url('img/main_bg.gif');
margin-bottom: 10px;
}
#main_wrapper_content {
width: 100%;
background-image:url('img/main_bg_content.gif');
margin-bottom: 10px;
}
html>body#main_wrapper_content { /* hack for at sætte width i Mozilla, Opera*/
margin-top: 10px;
}
#main_left {
float: left;
padding: 15px;
width: 50%;
}
#main_left_content {
float: left;
padding: 0;
width: 169px;
}
html>body div#main_left { /* hack for at sætte width i Mozilla, Opera*/
width: 45%;
}
html>body div#main_left_content { /* hack for at sætte width i Mozilla, Opera*/
width: 169px;
}
#leftmenu_wrapper {
border-bottom: 1px solid #fff;
}
div.leftmenu_on a span {
FILTER: DropShadow(Color=#807b67, OffX=1, OffY=1, Positive=1); width:100px; height: 15px; cursor: pointer;
}
div.leftmenu_off a span {
FILTER: DropShadow(Color=#807b67, OffX=1, OffY=1, Positive=1); width:100px; height: 15px; cursor: pointer;
}
div.leftmenu_on { /* layout for mozilla, opera */
drdoc: ";
drdoc: "";
background: #bcceda url(img/link_hjoerne.gif) bottom right fixed no-repeat;
width: 169px;
height: 35px;
padding: 15px 0 0 0;
margin: 0px;
border-top: 1px solid #fff;
text-align: left;
/*";/* IE */
}
div.leftmenu_on a {
width: 169px;
height: 50px;
padding: 20px 10px 20px 10px;
background: #bcceda url(img/link_hjoerne.gif) bottom right fixed no-repeat;
border-top: 1px solid #fff;
text-decoration: none;
text-align: left;
font-size:12px;
font-weight:bold;
letter-spacing: 1px;
color: #fff;
drdoc: ";
drdoc: "";
padding: 15px;
border-top: 0px solid #fff;
/*";/* IE */
border-bottom-width: 0;
}
div.leftmenu_on a:hover {
drdoc: ";
drdoc: "";
color: #658ca7;
/*";/* IE begin again */
}
div.leftmenu_off { /* layout for mozilla, opera */
drdoc: ";
drdoc: "";
background: #658ca7;
width: 169px;
height: 35px;
padding: 15px 0 0 0;
margin: 0px;
border-top: 1px solid #fff;
text-align: left;
/*";/* IE begin again */
}
div.leftmenu_off a {
width: 169px;
height: 50px;
padding: 20px 10px 20px 10px;
background: #658ca7;
border-top: 1px solid #fff;
text-decoration: none;
text-align: left;
font-size:12px;
font-weight:bold;
letter-spacing: 1px;
color: #fff;
drdoc: ";
drdoc: "";
padding: 15px;
border-top: 0px solid #fff;
/*";/* IE begin again */
border-bottom-height: 0;
}
div.leftmenu_off a:hover {
width: 169px;
height: 50px;
padding: 20px 10px 20px 10px;
background: #bcceda url(img/link_hjoerne.gif) bottom right fixed no-repeat;
border-top: 1px solid #fff;
text-decoration: none;
text-align: left;
font-size:12px;
font-weight:bold;
letter-spacing: 1px;
color: #fff;
drdoc: ";
drdoc: "";
padding: 15px;
border-top: 0px solid #fff;
background: #658ca7;
/*";/* IE begin again*/
border-bottom-height: 0;
}
div.leftmenu_off a:hover {
drdoc: ";
drdoc: "";
color: #bcceda;
/*";/* IE */
}
/*-- general link format --*/
a:link {
font-family: verdana, Geneva, Arial, Helvetica, sans-serif; font-weight: normal; color: #02226a;
text-decoration: none;
border-bottom: 1px dotted #02226a;
}
a:visited {
font-family: verdana, Geneva, Arial, Helvetica, sans-serif; font-weight: normal; color: #023098;
text-decoration: none;
border-bottom: 1px dotted #023098;
}
a:hover {
font-family: verdana, Geneva, Arial, Helvetica, sans-serif; font-weight: normal; color: #88a2b4;
text-decoration: none;
border-bottom: 1px dotted #88a2b4;
}
a:active {
font-family: verdana, Geneva, Arial, Helvetica, sans-serif; font-weight: normal; color: #023098;
text-decoration: none;
border-bottom: 1px dotted #023098;
}
.nounderline {
border-bottom-width: 0;
}
[edited by: DrDoc at 2:46 pm (utc) on Aug. 19, 2004]
[edit reason] Welcome to WebmasterWorld! [WebmasterWorld.com] [/edit]
I'm sorry but there is a lot of proprietary? CSS code in there and as such is fairly difficult to read..
div.leftmenu_on a:hover {
drdoc: ";
drdoc: "";
color: #658ca7;
/*";/* IE begin again */
}
I'm presuming that this (bold bits) is some sort of hiding hack? is so there are easier ways to feed values to IE and I think what this is doing is not giving the value to IE and as I don't see any IE specific code for the :hover it is using the general code?
or can anyone else see anything, I'm still in hols mode.. :)
Thx
Suzy
border-top: 0px solid #fff;
/*";/* IE */
border-bottom-width: 0;
}
}
Since you specifically mention that the dotted bottom border from your 'general' link styles is showing up when it shouldn't, I focused on studying just that one property, and noticed that in all the <div> specific a and a:hover rules, the border-bottom properties follow the string of code that I italicized in the quote above.
Since the problem as you describe it is that the <div> specific styles are not overriding the general styles, it would appear that this added string is preventing the browser from seeing the new, <div> specific border properties. (Although this doesn't seem to be the case with the text color, which was the other property you mentioned was not being overrode.)
I'll also note that several of your rules indicate border-bottom-height which is not a CSS property (that I know of), and so will not override any existing, valid styles.
Oh, and welcome back, Suzy! :)
There's no problem removing the general a href formatting on the unordered list - don't ask why...?
