CSS Forum

**silverglade** · 05-07-2009, 02:19 PM

hi, my nav links are showing up purple and underlined when i defined them black and blue in my nav list. any help greatly appreciated. thanks. derek.

here is the page im talking about

http://derekvanderven.com/new_doctor_site/home.html

here is the css and the html on one page (note: this was my first website im redoing so the css is not in another file and is very sloppy)

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="footer.css" rel="stylesheet" type="text/css"/>

<title>Dr. Madison home</title>
<style type="text/css">
body {
    margin: 0;  /* clear for browsers */
    padding: 0;
    background-color: #3E728E;     
     
}
#wrapper {
    background-image: url(home_background_new.jpg);
    background-repeat:no-repeat; 
    width: 800px;                   
    margin:0 auto 0;   /*-- top, (right left auto) , bottom zero centers the wrapper */
}
#contactblock {
    width:100%;      
    height:560px;  /* encloses the contact info, before the navigation. down to just above navigation */
}
      
 #links {
 background-image: url(nav_background.jpg);
    background-repeat:no-repeat; 
100%;
height: 70px;
clear: both;
text-align: center;
padding-top: 3px;
 font-weight: bold;
    font-size: large;
}

#links ul {
list-style-type:none;
margin-top: 10px;
padding:0;
 
}
#links ul li {
display:inline;
margin:0 50px;
line-height:1.5em;
 
 
}
#links ul li a:link, #toplinks ul li a:visited {
color:#000;
text-decoration:none;
height:1.8em;
}
#links ul li a:hover, #toplinks ul li a:active{
color:#375B97;
text-decoration:none;
}



#contactinfo {
              /* puts the box near center by its size compared to whole width*/
    float:right;        /* floats it to the right first, then 75percent shrinks it.*/
    margin:0 30px 0 auto;
     text-align:center;
     clear:both;
         /* top 0, (right left 0) , bottom 5 -->  /* a margin of 5em bottom pushes down the form content */
}
 
/*#contactinfo p {
    position:relative; /* pushes text to the right 8em relative to the contactinfo box. */
    /*left:5em;
    margin:0 0 .1em; */    /* <!-- top 0, (right left  0) , bottom 1 space between lines--> 
}*/
#content {
        /* puts the box near center by its size compared to whole width*/
    width: 40%;
    float:right;
    margin-right: 10px;
    height: 150px;
    margin-top: 100px;
    clear:both;    
    border: 1px solid black; 
}
 
 #content p {
 padding: 10px;
 }
 
.style1 {
    color: #0066CC; 
    font-weight: bold;
    text-align:center;
    font-size: xx-large;
}

#doctext {
    float:right;
    height: 1em;
    margin-top: 100px;
    margin-bottom:50px;
    margin-right:30px;

}
 
 p
{ 
text-indent: 20px

}
 


</style>
</head>
<body> 
<div id="wrapper">
<div id="contactblock">
  
  <div class="style1 " id="doctext"> Dr. Madison</div>
  <div id="contactinfo">
     
    Address: 105 E 50th St Suite 600 <br />
    New York, NY 01234 <br />
    123.123.1234 <br />
      Fax:123.123.1234 <br />
 </div>
  
  <div id="content"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum sit amet nulla luctus est condimentum feugiat. Phasellus consequat euismod erat vitae accumsan. Vestibulum nec arcu lectus,</div>

</div>
<!-- end of contentblock -->

  <div id="links"><ul class="style2 style3">
<li><a href="home.html">Home </a></li>
<li><a href="aboutus.html">About Us </a></li>
<li><a href="services.html">Services </a></li>
<li><a href="contact.html">Contact Us </a></li>
 
</ul> 
  </div>
  <div id="footer" >
    © Derek Van Derven website design 2009</div>
  
  
</div> <!-- end wrapper div -->
 <!-- Start of StatCounter Code -->
  <script type="text/javascript">
sc_project=3569481; 
sc_invisible=1; 
sc_partition=39; 
sc_security="7e526e75"; 
  </script>

  
  <script type="text/javascript" src="http://www.statcounter.com/counter/counter.js"></script>

<p align="center"><a href="http://derekvanderven.com"></a>
<noscript><div class="statcounter"><a title="free hit counter" href="http://www.statcounter.com/free_hit_counter.html" target="_blank"><img class="statcounter" src="http://c40.statcounter.com/3569481/0/7e526e75/1/" alt="free hit counter" ></a></img></div></noscript>
<!-- End of StatCounter Code -->

<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-4025495-1";
urchinTracker();
</script>
</body></html>

**LadynRed** · 05-07-2009, 02:58 PM

Quote:

#links ul li a:link, #toplinks ul li a:visited {
color:#000;
text-decoration:none;
height:1.8em;
}
#links ul li a:hover, #toplinks ul li a:active{
color:#375B97;
text-decoration:none;
}

First of all, your declarations are inconsistent, you have #toplinks and #links - looks like your nav is in #links, so fix that.

**silverglade** · 05-07-2009, 03:19 PM

thanks ladynred you have an eagle eye. ya the page is pretty bad but i dont want to make a whole new css sheet out of it looking through the css. im just trying to change the site the best i can. but the code is pretty bad.thanks for helping me again.

**LadynRed** · 05-07-2009, 03:51 PM

Quote:

thanks ladynred you have an eagle eye.

What I have is FIREBUG !!!!