(brilliant CSS)
from zeldman.com (synd@zeldman2)
(doesn’t work in MSIE – go figure)
/* Paragraph text */
p {
color: #333333
}
/* Links within paragraphs (subtle) */
p a {
color: #666666;
text-decoration: none;
}
/* Links within paragraphs (revealed) */
p:hover a {
color: blue;
text-decoration: underline;
}
/* Rollover effect for links within paragraphs */
p a:hover {
color: red;
}
body {
margin : 10px;
font: Verdana, Helvetica, Arial;
padding: 0px;
background: #fff;
}
#menu {
border-bottom : 1px solid #ccc;
margin : 0;
padding-bottom : 19px;
padding-left : 10px;
}
#menu ul, #menu li {
display : inline;
list-style-type : none;
margin : 0;
padding : 0;
}
#menu a:link, #menu a:visited {
background : #E8EBF0;
border : 1px solid #ccc;
color : #666;
float : left;
font-size : small;
font-weight : normal;
line-height : 14px;
margin-right : 8px;
padding : 2px 10px 2px 10px;
text-decoration : none;
}
#menu a:link.active, #menu a:visited.active {
background : #fff;
border-bottom : 1px solid #fff;
color : #000;
}
#menu a:hover {
color : #f00;
}
body.section-1 #menu li#nav-1 a,
body.section-2 #menu li#nav-2 a,
body.section-3 #menu li#nav-3 a,
body.section-4 #menu li#nav-4 a {
background : #fff;
border-bottom : 1px solid #fff;
color : #000;
}
#menu #subnav-1,
#menu #subnav-2,
#menu #subnav-3,
#menu #subnav-4 {
display : none;
width: 90%;
}
body.section-1 #menu ul#subnav-1,
body.section-2 #menu ul#subnav-2,
body.section-3 #menu ul#subnav-3,
body.section-4 #menu ul#subnav-4 {
display : inline;
left : 10px;
position : absolute;
top : 95px;
}
body.section-1 #menu ul#subnav-1 a,
body.section-2 #menu ul#subnav-2 a,
body.section-3 #menu ul#subnav-3 a,
body.section-4 #menu ul#subnav-4 a {
background : #fff;
border : none;
border-left : 1px solid #ccc;
color : #999;
font-size : smaller;
font-weight : bold;
line-height : 10px;
margin-right : 4px;
padding : 2px 10px 2px 10px;
text-decoration : none;
}
#menu ul a:hover {
color : #f00 !important;
}
#contents {
background : #fff;
border : 1px solid #ccc;
border-top : none;
clear : both;
margin : 0px;
padding : 15px;
}
