Once more: Help
I have a website that I’m building for my new practice.
On the far right is the “social media tab”. When you hover it gets an ugly line (revealed background?) under it. I’ve finally got my other links the way I like them and that my partner is also happy with. However, I’ve tried everything my simple little brain can come up with to make this “line” go away. Please help me yet again.
Here is the link to the master template. You can see the source code there.
Here is the CSS:
/* null margins and padding to give good cross-browser baseline */
html,body,address,blockquote,div,
form,fieldset,caption,
h1,h2,h3,h4,h5,h6,
hr,ul,li,ol,ul,
table,tr,td,th,p,img {
margin:0;
padding:0;
}
a:link {color:#ebebeb;} /* unvisited link */
a:visited {color:#ebebeb;} /* visited link */
a:hover {background-color:#333333;}; /*mouse over link*/
a:active {color:#0000FF;} /* selected link */
h2 {
font:bold 150%/120% verdana,helvetica,sans-serif;
padding-bottom:0.4em;
}
p {
padding-bottom:1em;
}
img,fieldset {
border:none;
}
body {
text-align:center; /* center #pageWrapper IE 5.x */
font:100%/140% verdana,helvetica,sans-serif;
color:#000;
background:#ffffff url(images/backgroundbase3.png) top center repeat-x;
}
.socialmediatab {
position: fixed;
right: -8px;
top: 400px;
}
.socialmediatab:hover {right: 0; }
#pageWrapper {
width:960px;
margin:0 auto;
text-align:left;
background:url(images/logograd2.jpg) top center no-repeat;
}
h1 {
overflow:hidden;
height:60px;
font:italic 36px/60px georgia,times,serif;
}
h1 span {
float:left;
text-transform:uppercase;
color:#FFFF00;
-moz-text-shadow:2px -2px 1px #000;
-webkit-text-shadow:2px -2px 1px #000;
text-shadow:1px -1px 2px #000;
}
h1 small {
display:block;
margin:0 225px 0 390px;
text-align:center;
-moz-text-shadow:2px -2px 1px #FFFFFF;
-webkit-text-shadow:2px -2px 1px #FFFFFF;
text-shadow:2px -2px 1px #000;
font-family: georgia, times, serif;
font-size: 20px;
font-style: normal;
line-height: 62px;
font-weight: normal;
font-variant: normal;
color: #F00;
}
h2 content {
overflow:hidden;
height:30px;
font-family: georgia, times, serif;
font-size: 20px;
font-style: normal;
line-height: 30px;
color: #ebebeb;
text-decoration: none;
padding: 0px;
}
h2 titleblock {
overflow:hidden;
height:30px;
font-family: Verdana, Geneva, sans-serif;
font-size: 20px;
font-style: normal;
line-height: 30px;
color: #000000;
text-decoration: none;
padding: 0px;
text-transform: capitalize;
background-color: #FFF;
white-space: normal;
text-shadow:-2px 2px 1px #666666;
font-weight: lighter;
border-right-width: medium;
border-left-width: medium;
border-right-style: solid;
border-left-style: solid;
border-top-color: #FFF;
border-right-color: #FFF;
border-bottom-color: #FFF;
border-left-color: #FFF;
font-variant: small-caps;
}
h3 content {
overflow:hidden;
height:50px;
font-family: georgia, times, serif;
font-size: 18px;
font-style: normal;
line-height: 60px;
color: #ebebeb;
text-decoration: none;
padding: 0px;
}
p content {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 1.2em;
color: #ebebeb;
text-decoration: none;
text-align: left;
margin: 0px;
padding: 0px;
a:link {color:#FF0000;} /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;} /* mouse over link */
a:active {color:#0000FF;} /* selected link */
}
p contentimportant {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 1.7em;
color: #ebebeb;
text-decoration: none;
text-align: left;
margin: 0px;
padding: 0px;
}
#topContact {
float:right;
text-align:right;
margin-top:-55px;
height:57px;
font:normal 12px/16px verdana,helvetica,sans-serif;
color:#FFF;
}
#mainMenu {
clear:both;
list-style:none;
height:35px;
font:bold 16px/19px verdana,helvetica,sans-serif;
border-left:1px solid #FFF;
}
#mainMenu li {
float:left;
height:35px;
border-right:1px solid #FFF;
}
#mainMenu a {
position:relative;
float:left;
padding:8px 16px 13px;
/*margin-bottom:-5px;*/
text-decoration:none;
color:#FFF;
}
#mainMenu .current a {
background:#BDE;
}
#mainMenu a:active,
#mainMenu a:focus,
#mainMenu a:hover {
padding-bottom:8px; /* adjusts for height change */
border-bottom:5px solid #C56065;
}
.flag {
position:relative;
top:8px;
left: 8px;
}
#label {
/*line-height:48px;*/ /* should be larger than default font */
/*
120px + 132px + 48px == 300px
the amount we want to push #content down by!
*/
/*background:#8F8;*/
text-align: left;
margin-top: 20px;
margin-right: 0;
margin-bottom: 0px;
margin-left: 0;
padding-top: 0;
padding-right: 1em;
padding-bottom: 0;
padding-left: 7px;
}
#content {
/*background-color:#66FF00;*/
text-align:left;
width:960px;
height: 690px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
background-image: url(images/textbkgnd.jpg);
background-repeat: no-repeat;
background-position: left top;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 7px;
overflow:auto;
}
#left {
/*background-color:#FF0000;*/
width: 690px;
height: 635px;
padding-top: 30px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 20px;
float:left;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
.floatleftcontentpix{
float: left;
margin: 0px 10px 0px 0px;
padding: 0px;
}
.newsletter {
float: right;
margin: 0 10px 0 0;
padding: 0;
}
#right{
/*Background-color:#FF0;*/
width: 200px;
height: 635px;
padding-top: 30px;
padding-right: 20px;
padding-bottom: 0px;
padding-left: 0px;
float:right;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
#navcontainer
{
/*background: #40627d;*/
width: 100%;
margin: 0 auto;
padding: 1em 0;
font-family: georgia, serif;
font-size: 13px;
text-align: center;
/*text-transform: lowercase;*/
}
ul#navlist
{
text-align: left;
list-style: none;
padding: 0;
margin: 0 auto;
width: 80%;
}
ul#navlist li
{
display: block;
margin: 0;
padding: 0;
}
ul#navlist li a
{
display: block;
width: 100%;
padding: 0.2em 0 0.2em 2em;
border-width: 1px;
border-color: #ffe #aaab9c #40627d #fff;
border-style: solid;
color: #fff; /*Button Text Color*/
text-decoration: none;
background: #000; /*Button Color*/
}
#navcontainer>ul#navlist li a { width: auto; }
ul#navlist li#active a
{
background: #fbff34;
color: #800000;
}
ul#navlist li a:hover, ul#navlist li#active a:hover
{
color: #ebebeb;
background: transparent;
border-color: #aaab9c #fff #fff #ccc;
}
#labelindex {
height:250px;
text-align: left;
margin-top: 15px;
margin-right: 0;
margin-bottom: 0px;
margin-left: 0;
padding-top: 0;
padding-right: 1em;
padding-bottom: 0;
padding-left: 7px;
}
.floatrightlabelindex{
float:right;
clear:both
height:250px;
width:350px;
}
#contentindex {
text-align:left;
width:960px;
height: 690px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
background-image: url(images/textbkgndnologo.jpg);
background-repeat: no-repeat;
background-position: left top;
margin-top: 30px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 7px;
overflow:auto;
}
.ulindex{
margin:0;
padding:0;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 1.7em;
color: #ebebeb;
text-decoration: none;
list-style:circle;
text-shadow:1px -1px 2px #333;
}
