473,320 Members | 2,029 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

Need help with :active state

victorduwon
Hi Folks,
i have a list based navigation menu with two tiers of navigation. The second tier displays when the tabs on the first tier are hovered over. The problem I have is that when the tabs are clicked on the second tier dissapears. I need the second tier for the active tab to remain visible and the background of the tab to remain visible when the tab is clicked/active. Someone please help me, this is driving me crazy. Below is the CSS.

Thanks.

Expand|Select|Wrap|Line Numbers
  1. @charset "UTF-8";
  2. /* CSS Document */
  3.  
  4. .test_nav {
  5.     height:26px;
  6.     width:943px;
  7.     text-align: center;
  8.     position:absolute; 
  9.     font-family:arial, verdana, sans-serif; 
  10.     font-size:11px;
  11.     z-index:500;
  12.     border-top: #CCC solid 1px;
  13.     border-bottom: #CCC solid 1px;
  14. }
  15.  
  16. .test_nav .select {
  17.     margin:0; 
  18.     padding:0; 
  19.     list-style:none; 
  20.     white-space:nowrap;
  21. }
  22.  
  23. .test_nav li {
  24.     float:left;
  25. }
  26.  
  27. .test_nav .select a {
  28.     display:block; 
  29.     height:26px; 
  30.     float:none; 
  31.     padding: 0 0 0px; 
  32.     text-decoration:none; 
  33.     line-height:25px; 
  34.     white-space:nowrap; 
  35.     color:#000;
  36. }
  37.  
  38. .test_nav .select li.line a {
  39.     text-align: center;
  40.     color:#000;
  41. }
  42.  
  43. .test_nav .select a b {
  44.     display:block; 
  45.     padding:0 20px 0px 16px; 
  46.  
  47. }
  48.  
  49. .test_nav .select a:hover, 
  50. .test_nav .select li:hover a {
  51.     text-decoration: none;
  52.     text-align: center;
  53.     color: #a90909;
  54.     background-image: url(subnav_bg_blue.gif);
  55. }
  56.  
  57. .test_nav .select li.line a:hover, 
  58. .test_nav .select li.line:hover a {
  59.     color:#cfa;
  60. }
  61.  
  62. .test_nav .select a:hover b, 
  63. .test_nav .select li:hover a b {
  64.     text-decoration: none;
  65.     color: #fff;
  66. }
  67.  
  68. .test_nav .sub {
  69.     display:none;
  70. }
  71. .test_nav ul ul {
  72.     display:none;
  73. }
  74.  
  75. /* IE6 only */
  76. .test_nav table {
  77.     border-collapse:collapse; 
  78.     margin:-1px; 
  79.     font-size:1em; 
  80.     width:0; 
  81.     height:0;
  82. }
  83.  
  84. .test_nav .sub {
  85.     margin:0; 
  86.     padding:0;
  87.     list-style:none;
  88. }
  89.  
  90. .test_nav .sub li {background:transparent;}
  91.  
  92. .test_nav .select :hover .sub {
  93.     height:25px;
  94.     display:block; 
  95.     position:absolute;
  96.     float:left;
  97.     width:943px;
  98.     top:26px; 
  99.     left:1px; 
  100.     text-align:center;
  101.     border:1px solid #ccc;
  102.     border-width:1px  0;
  103. }
  104.  
  105. .test_nav .select :hover .rt li {
  106.     float:right;
  107. }
  108.  
  109. .test_nav .select :hover .sub li a {
  110.     display:block; 
  111.     height:26px; 
  112.     line-height:26px; 
  113.     float:left; 
  114.     background:transparent url(line/transparent.gif);
  115.     padding:0 12px; 
  116.     margin:0; 
  117.     white-space:nowrap; 
  118.     color:#888;font-size:9px;
  119. }
  120.  
  121. .test_nav .select :hover .sub li.subline a {color:#000;}
  122.  
  123. .test_nav .select :hover .sub li a:hover,
  124. .test_nav .select :hover .sub li:hover
  125. {color:#000; line-height:26px; position:relative;}
  126.  
  127. .test_nav .select :hover .sub li:hover > a {color:#000;}
  128.  
  129. .test_nav .select :hover .sub :hover ul {
  130.     padding:0;
  131.     margin:0; 
  132.     list-style:none; 
  133.     display:block; 
  134.     width:112px; 
  135.     position:absolute; 
  136.     left:-1px; 
  137.     top:26px; 
  138.     border-bottom:1px solid #000; 
  139.     background:#fff;
  140. }
  141.  
  142. .test_nav .select :hover .sub :hover ul ul {
  143.     position:absolute; left:-9999px;
  144. }
  145.  
  146. .test_nav .select :hover .sub :hover ul li {
  147.     border:1px solid #fff; border-width:0 1px;
  148. }
  149.  
  150. .test_nav .select :hover .sub :hover ul li a {
  151.     width:80px; 
  152.     text-align:left;
  153.     height:26px; 
  154.     line-height:18px; 
  155.     background:#fff;
  156.  }
  157. .test_nav .select :hover .sub :hover ul li a:hover {
  158.     line-height:16px;
  159. }
  160. .test_nav .select :hover .sub :hover ul li:hover > a {
  161.     line-height:26px;
  162. }
  163.  
  164. .test_nav .select :hover .sub :hover ul :hover ul {
  165.     left:112px; 
  166.     top:0; 
  167.     border:1px solid #ccc; 
  168.     border-width:0 1px 1px 0;
  169.     background:#fff;
  170.  }
  171.  
  172. .test_nav .select :hover .rt :hover ul :hover ul {
  173.     left:-113px; 
  174.     top:0; 
  175.     border:1px solid #ccc; 
  176.     border-width:0 0 1px 1px;
  177. }
  178.  
  179. .test_nav .select :hover .sub :hover ul :hover ul li {
  180.     border-left:1px solid #ccc; 
  181.     background:#fff;
  182. }
  183.  
  184. .test_nav .select :hover .sub :hover ul :hover ul li.a1 {
  185.     border-left:1px solid #fff;
  186. }
  187. .test_nav .select :hover .sub :hover ul :hover ul li.a2 {
  188.     border-top:1px solid #000;
  189.     height:26px;
  190. }
  191.  
  192. .test_nav .select :hover .rt :hover ul :hover ul li {
  193.     border-right:1px solid #000;
  194.     border-left:0;
  195. }
  196.  
  197. .test_nav .select :hover .rt :hover ul :hover ul li.a1 {
  198.     border-right:1px solid #fff; 
  199.     border-left:0;
  200. }
  201.  
  202. </style>
  203.  
Someone please tell me what I am doing wrong.
Mar 24 '08 #1
0 1164

Sign in to post your reply or Sign up for a free account.

Similar topics

5
by: max(01)* | last post by:
hello. the following code: 1 from Tkinter import * 2 3 class MiaApp: 4 def __init__(self, genitore): 5 self.mioGenitore = genitore 6 self.i = IntVar()
5
by: Matthew Holton | last post by:
Hello everyone, I posted this question in the ADONet NG and havent gotten a response. I am hoping that one of you have a solution. Thanks in advance I was working on creating a data...
16
by: michael | last post by:
Is it possible to get all href URLs contained in a unordered list and place them in an array? Or in fact two different arrays, differently named one for each <ul> group? <ul> <li><a...
3
by: felecha | last post by:
I'm something of a rookie at .Net. I know I can set TabIndex for controls in a GroupBox, and tab my way over to a button so it's "Active" and will be clicked by hitting the Enter key. But isn't...
8
by: Steve Thompson | last post by:
Hello all, I was wondering the differnced there were betwee Active State's python and the open source version of python. Would I have to unistall my opend souce python? Additonally, how does...
6
by: shorti | last post by:
db2 8.1 fix pack 12 on AIX 5.3 This is a newly configured HADR machine. The HADR was up and running. I was 'playing' around some on the standby and did a db2 deactivate and things sort of went...
2
by: MK | last post by:
Hello, I am new to XML and PERL and I have a few questions the answers to which I need to complete a project. All your time and effort would be highly appreciated. I have to make a small HTML page...
7
by: m.gelosa | last post by:
Dear all, I got a problem on db2 for aix running a high workload messaging system with more than 5,000,000 of deliveries per day. During high peak hours it happens frequently that the...
0
JamieHowarth0
by: JamieHowarth0 | last post by:
I have been trying to find a solution to this on the Internet for months. Literally, ages and ages and ages, praying that someone in the open-source community has enough knowledge to put together an...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
0
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.