Webmaster Forum

Go Back   Webmaster Forum > Web Development > Coding Forum

Coding Forum Problems with your code? Discuss coding issues, including JavaScript, PHP & MySQL, HTML & CSS, Flash & ActionScript, and more.


Reply
 
Thread Tools Display Modes
Share |
  #1  
Old 02-14-2009, 02:35 PM
mixelplik mixelplik is offline
Junior Member
 
Join Date: 02-14-09
Posts: 7
iTrader: 0 / 0%
CSS menu problem!!! Help!

Hey Guys,

The snippet of code I'm sending you is from a site I recently completed. I can't get the menu working correctly. It's a css menu inside a div tag. I need it to show up as black text, underline on hover and then show the active link as bold. No visited link color. Everytime I look at it all the links show up purple (i.e. visited links). I thought I had stripped out the visited link behavior.

Please help, I'm stuck and I am frustrated. Please help me figure this menu out. Thank you.

I appreciate it.
MIke

---------------------------------------------------

Code:
<html> <head> <title>White Owl Astrology</title> <STYLE type="text/css"> div.text { overflow:auto; height:425px; width:500px; color:000000; text-align:left; margin-right:2px; margin-top:30px; margin-bottom:2px; font-family: verdana; font-size:10pt; scrollbar-face-color:#fcfcfc; scrollbar-highlight-color:#fcfcfc; scrollbar-3dlight-color:#fcfcfc; scrollbar-darkshadow-color:#A6A6A6; scrollbar-shadow-color:#A6A6A6; scrollbar-arrow-color:#A6A6A6; scrollbar-track-color:#A6A6A6; position: relative; } #navlist li { display: inline; list-style-type: none; padding-right: 20px; } a:link { color: #000000; } a:hover { text-decoration: underline; } a:active { text-decoration: none; } .style1 {font-size: 18pt} .style2 {font-size: 9px} </STYLE> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head> <body bgcolor=fcfcfc text=000000> <CENTER> <TABLE width=800 height=600 border=0 cellspacing=0 cellpadding=0> <TR> <TD width=256><IMG src="left.jpg" border=0 vspace=0 hspace=0></td> <TD width=544 valign=bottom align=right background="right.jpg" style="background-repeat:no-repeat;"> <div id="navcontainer", align="center"> <ul id="navlist"> <li id="active"> <A HREF="index.html">Home</A> | <A HREF="consultations.html">Consultations</A> | <A HREF="monthly-forecast.html">Monthly Forecast</A> | <A HREF="about-terri.html">About Terri</A> | <A HREF="Q-A.html">Q&amp;A</A> </ul> </div> <div class="text style1"> <p><em><strong>Evolutionary Astrology</strong></em> is another way to learn about ourselves, both past and present. There is a unique cosmic thumbprint which lies only<br> in your chart. Through the use of astrology and dreams we explore the next level on your journey. Welcome! </p> <p>Special thanks to <a href="http://www.moonbeamgallery.com/"><strong>moonbeamgraphics.com</strong></a> for the wonderful owl graphics that grace this website.</p> </div></td> </tr> </table> </center> <center class="style2">Copyright &copy; 2009 White Owl Astrology</center> </body> </html>

Last edited by chicgeek; 02-14-2009 at 02:48 PM.
 
Reply With Quote

Advertisement

Advertisement

  #2  
Old 02-14-2009, 02:47 PM
chicgeek's Avatar
chicgeek chicgeek is offline
Contributing Member
 
Join Date: 08-19-04
Location: Yorkshire
Posts: 14,188
iTrader: 0 / 0%
Moved to the coding forum, and added code tags.
 
Reply With Quote
  #3  
Old 02-14-2009, 06:17 PM
Capo64 Capo64 is offline
Contributing Member
 
Join Date: 06-11-07
Posts: 238
iTrader: 0 / 0%
Add
Code:
a:visited { color:#000; }
in between a:link and a:hover
 
Reply With Quote
  #4  
Old 02-14-2009, 10:35 PM
mixelplik mixelplik is offline
Junior Member
 
Join Date: 02-14-09
Posts: 7
iTrader: 0 / 0%
Thank you!

I did this with the code :

<html>
<head>
<title>White Owl Astrology</title>

<STYLE type="text/css">
div.text {
overflow:auto;
height:425px;
width:500px;
color:000000;
text-align:left;
margin-right:2px;
margin-top:30px;
margin-bottom:2px;
font-family: verdana;
font-size:10pt;
scrollbar-face-color:#fcfcfc;
scrollbar-highlight-color:#fcfcfc;
scrollbar-3dlight-color:#fcfcfc;
scrollbar-darkshadow-color:#A6A6A6;
scrollbar-shadow-color:#A6A6A6;
scrollbar-arrow-color:#A6A6A6;
scrollbar-track-color:#A6A6A6;
position: relative;
}
#navlist li
{
display: inline;
list-style-type: none;
padding-right: 20px;
}

a:link {
color: #000000;
text-decoration: none;
}
a:visited {
color:#000;
text-decoration: none;
}

a:hover {
color:#A6A6A6;
text-decoration: none;
}
a:active {
text-decoration: underline;
color:#000;
}
.style1 {font-size: 18pt}
.style2 {font-size: 9px}
</STYLE>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
<body bgcolor=fcfcfc text=000000>

<CENTER>
<TABLE width=800 height=600 border=0 cellspacing=0 cellpadding=0>
<TR>
<TD width=256><IMG src="left.jpg" border=0 vspace=0 hspace=0></td>
<TD width=544 valign=bottom align=right
background="right.jpg" style="background-repeat:no-repeat;">

<div id="navcontainer", align="center">
<ul id="navlist">
<li id="active">
<A HREF="index.html">Home</A> |
<A HREF="consultations.html">Consultations</A> |
<A HREF="monthly-forecast.html">Monthly Forecast</A> |
<A HREF="about-terri.html">About Terri</A> |
<A HREF="Q-A.html">Q&amp;A</A>

</ul>
</div>
<div class="text style1">
<p><em><strong>Evolutionary Astrology</strong></em> is another way to learn about ourselves, both past and present. There is a unique cosmic thumbprint which lies only<br>
in your chart. Through the use of astrology and dreams we explore the next level on your journey. Welcome! </p>
<p>Special thanks to <a href="http://www.moonbeamgallery.com/"><strong>moonbeamgraphics.com</strong></a> for the wonderful owl graphics that grace this website.</p>
</div></td>
</tr>
</table>
</center>
<center class="style2">Copyright &copy; 2009 White Owl Astrology</center>

</body>
</html>


----------------------

I added the a:visited {color:#000; text-decoration: none;} and that works great. I'm trying to get the active line to stay underlined as I go from page to page.

The underline shows up when you press any of the links and quickly vanishes. Why is this? I'm wondering if the links go back to alink? I want the active link to stay underlined so that people can tell which page they are currently on. Can someone show me what I need to do in the above code to accomplish this?

Thanks!
 
Reply With Quote
  #5  
Old 02-15-2009, 10:22 AM
mixelplik mixelplik is offline
Junior Member
 
Join Date: 02-14-09
Posts: 7
iTrader: 0 / 0%
Guys thanks so much for your help! Can anyone help me with this new problem that popped up? I added it to the tail of this thread.

Thank you!
 
Reply With Quote
  #6  
Old 02-15-2009, 10:26 AM
Capo64 Capo64 is offline
Contributing Member
 
Join Date: 06-11-07
Posts: 238
iTrader: 0 / 0%
a:active is only used from immediately after you click until the new page loads.

if you want the link of the current page to do anything, you have to do that manually.

As far as I know, there's no pseudoclass for if the href is the same as the current page
 
Reply With Quote
Go Back   Webmaster Forum > Web Development > Coding Forum

Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Problem with css and menu,IE6 khucthuydu Web Design Lobby 4 08-21-2008 08:35 AM
Menu alignment problem kade119 Coding Forum 63 03-24-2007 05:55 PM
PROBLEM WITH JAVASCRIPT MENU fake$ Coding Forum 5 06-22-2006 05:14 AM
Menu Problem with phpCOIN. visnesuyu Coding Forum 3 07-15-2005 06:13 AM
Problem with Dropdown menu AND CSS pachrist Coding Forum 1 06-03-2004 05:24 PM


V7N Network
Get exposure! V7N I Love Photography V7N SEO Blog V7N Directory


All times are GMT -7. The time now is 03:12 PM.
Powered by vBulletin
Copyright 2000-2014 Jelsoft Enterprises Limited.
Copyright © 2003 - 2018 VIX-WomensForum LLC