472,950 Members | 2,676 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

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

Hi, every one, anchor tag in li tag is problem, pls see it

Hi every one,
I designed a web page, having horizontal menu using UL and LI tags;

I need to be set rollover effect for a menu items.

whenever user hover on a menu item, the entire item(including anchor tag text) has to change to another color,
but since iam using anchor tag in LI tag, the text in the menu item is not changing color when i hover on the menu item(LI). (but changing color when i hover on the anchor tag Text).


But i want the entire item(including anchor tag text) has to change to another color,
whenever user hover on a menu item(LI).

(i think Iam clear to explain, If not please excuseme)

here is the entire code i have used for designing page

please verify my code and tell me necessary changes to make it possible.


---------------html file------------
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title>index</title>
  6.  
  7. <link href="consult.css" rel="stylesheet" type="text/css" />
  8. <link href="menu.css" rel="stylesheet" type="text/css" />
  9. <link href="style.css" rel="stylesheet" type="text/css" />
  10.  
  11. <script src="jsfiles/login.js" type="text/javascript" language="javascript"></script>
  12. </head>
  13.  
  14. <body class="bdy"  onload="disableButton()">
  15.  
  16. <!--wrap-->
  17. <div id="wrap">
  18.  
  19. <!-- hedr -->
  20. <div id="hedr">
  21.  
  22.     <!-- MarQuee -->
  23.     <div id="marq">
  24.       <marquee behavior="scroll" direction="left" width="100%"><img src="imgs/123.gif" style=""></marquee>
  25.     </div>
  26.     <!-- ends marquee -->
  27.  
  28.  
  29.     <!-- LogIn info  -->
  30.     <div id="stsup">
  31.       <table width=358 height="25" border='0' style="border-collapse: collapse" cellspacing='0' cellpadding='1' align="left">
  32.        <tr>
  33.          <td width="87" height=20 valign="top" ><div><span class="para" style="color:white">&nbsp;&nbsp; Admin Login</span></div></td>
  34.          <td width="297" valign="middle">
  35.            <form id="loginForm" method="POST" action="innerpages/jobs.php">
  36.  
  37.             <div align="left"  class="para">
  38.               <input id="email" name="username" type="text" value="username" class="ltxt" onclick="clrtxt1()" onfocus="clrtxt1()"/>
  39.               <input id="password" name="password" type="password" value="password" class="ltxt" onclick="clrtxt2()" onfocus=                "clrtxt2()" onblur="chklog()" />
  40.               <input type="submit" id="submitbtn" name="submitbtn" value="Login" class="lbtn"  />
  41.             </div>
  42.           </form>          </td>
  43.         </tr>
  44.       </table>
  45.     </div> 
  46.        <!-- ends loginfo -->
  47. </div>
  48. <!-- ends hedr -->
  49.  
  50.     <!-- menu -->  
  51.       <div id="nav">
  52.         <ul class="menu2" >
  53.  
  54.             <li ><a href="consult.html"  title="Aboutus" class="active"><span>Aboutus</span></a></li>
  55.             <li ><a href="innerpages\clients.html"  title="Clients"><span>Clients</span></a></li>
  56.             <li ><a href="innerpages\outsource.html"  title="Outsourcing"><span >Out sourcing</span></a></li>    
  57.             <li ><a href="innerpages\jobsdispay.php"  title="Jobs"><span >Jobs</span></a></li>
  58.             <li ><a href="innerpages\testing.html"  title="Testing"><span >Testing</span></a></li>    
  59.             <li ><a href="innerpages\conus.html"  title="Contactus"><span >Contactus</span></a></li>        
  60.         </ul>
  61.     </div>
  62.     <!-- ends menu-->
  63.  
  64. <!-- content -->
  65.     <div id="cntnt">
  66.  
  67.       <table border="0" cellspacing="0" cellpadding="0" width="695" class="tblimg">
  68.           <tr>
  69.           <td width="541" valign="top">
  70.           <span class="para1">About Blue Berry</span><br /><br />
  71.           <span class="para">
  72.        Blue Berry is a premiere information technology services company specializing in Staffing Services,and Testing Services. Blue Berrys goal is to consistently provide the highest quality service and technical expertise for our information technology clients, delivered by professionals who have both academic and applied experience.<br /><br />
  73.  
  74.     Blue Berry is engaged in the business of working with organizations, to understand and meet the requirement imperatives of the ever changing and growing Industry, providing them with the competitive advantage with the intellectual capital and cutting-edge technology solutions,we offer Contract/Contract-to-Hire. <br /><br />
  75.     </span></td>
  76.     <td align="right" width="154" style="padding:0px;"><div id="img1"></div></td>
  77.     </tr>
  78.     <tr>
  79.     <td height="311" colspan="2">
  80.     <span class="para">
  81.     Help when you need it <br />
  82.     Concentrating on your core business is the top priority, so when technology issues arise they can be distracting and taxing on your internal resources. We provide assistance to augment your resources with the talent you need.<br /><br />
  83.  
  84.     Delivering Optimal Workforce Flexibility<br />
  85.     At Blue Berry, we offer skilled technology talent that delivers the professional expertise you need, when you need it -- from short-term and long-term contract assignments to contract-to-hire and direct-hire placements. We are uniquely structured to recruit, screen, deploy and manage a technical workforce anywhere in the United States. <br /><br />
  86.     Ensuring Quality in Every Hire<br />
  87.     With offices strategically located throughout the country, we offer technology professionals for every level of your organization, from help desk technicians to CIOs. And, our comprehensive recruiting and screening process is one of the most robust in the industry. <br /><br />
  88.     It includes: <br />
  89.     Interviews <br />
  90.     Reference &amp; background checks <br />
  91.     Drug screening <br />
  92.     Soft-skills assessment <br /> 
  93.     Technical proficiency testing<br /> 
  94.     Whether you're looking for contract, contract-to-hire or direct-hire support, Blue Berry delivers high-caliber technology talent for virtually any skill set and position.</span></td>
  95.     </tr>
  96. </table>
  97.   </div>
  98.     <!-- ends content -->
  99.  
  100. <!-- footer -->
  101.       <div class="footr">
  102.         <table width="696" height="24" border="0" cellpadding="0" cellspacing="1" class="footrtbl">
  103.         <tr>
  104.         <td height="22"  valign="middle" >
  105.           <span class="para">Copyright &copy; 2008. All rights resereved.</span>        </td>  
  106.         <td width="427"  align="left" valign="middle"><span class="para">Site designed and developed by <a href="http://www.indusray.in" target="_blank" class="folnk" >IndusRay Software Services</a></span> </td>
  107.         </tr>
  108.         </table>
  109.     </div>
  110. <!-- ends footer -->
  111.  
  112. </div>
  113.  
  114. </body>
  115. </html>
  116.  
  117.  
  118.  
----------------style.css-----------------

Expand|Select|Wrap|Line Numbers
  1. .bdy,
  2. html {
  3.     margin:0;
  4.     padding:0;
  5. }
  6.  
  7. .bdy {
  8.     min-width:710px;
  9.     background-attachment: scroll;
  10.     background-image:url(imgs/bg_b.gif);
  11.     background-repeat:repeat;
  12.     background-position: left top;
  13.     /*background-color:#0099FF;*/
  14. }
  15.  
  16.  
  17.  
  18. #wrap #hedr {
  19.     height: 163px;
  20.     width: 700px;
  21.     background-attachment: scroll;
  22.     background-image: url(imgs/blue1.jpg);
  23.     background-repeat: no-repeat;
  24.     background-position: center top;
  25.  
  26. }
  27.  
  28.  
  29.  
  30.  
  31. .footr {
  32. border:#AACCEE solid 1px;
  33. background:#fff;
  34. }
  35.  
  36. .footr .para{
  37.     font-family: Arial, Helvetica, sans-serif;
  38.     font-size: 11px;
  39.     font-style: normal;
  40.     color:#07519A;
  41.     word-spacing:5px;
  42.     white-space:normal;
  43.  
  44.     padding-right:3px;
  45.     text-align: justify;
  46. }
  47.  
  48. .footr .folnk {
  49.     font-family: Arial, Helvetica, sans-serif;
  50.     font-size: 12px;
  51.     font-style: normal;
  52.     font-weight: bold;
  53.     color:#07519A;
  54.     text-decoration:none;
  55. }
  56.  
  57.  
  58.  
  59. #cntnt {
  60. border:#AACCEE solid 1px;
  61. background-color:#fff;
  62. }
  63.  
  64. .bdy #marq {
  65.     position: absolute;
  66.     height: 37px;
  67.     width: 449px;
  68.     left: 305px;
  69.     top: 36px;
  70.     z-index: 10;
  71. }
  72.  
  73.  
  74. #cntnt .para {
  75.     font-family: Arial, Helvetica, sans-serif;
  76.     font-size: 11px;
  77.     font-style: normal;
  78.     color:#07519A;
  79.     word-spacing:5px;
  80.     white-space:normal;
  81.     line-height:20px;
  82.  
  83.     padding-right:3px;
  84.     text-align: justify;
  85.     }
  86.  
  87. #cntnt .para1 {
  88.     font-family: Arial, Helvetica, sans-serif;
  89.     font-size: 12px;
  90.     font-style: normal;
  91.     font-weight: bold;
  92.     color:#07519A;
  93. }
  94. .bdy #wrap #hedr #logo {
  95.     background-attachment: scroll;
  96.     background-image: url(imgs/bluberrylogo1.jpg);
  97.     background-repeat: no-repeat;
  98.     background-position: left top;
  99.     position: absolute;
  100.     height: 130px;
  101.     width: 169px;
  102.     z-index: 300;
  103.     left: 0px;
  104.     top: 68px;
  105. }
  106.  
  107.  
  108. .menu2 li a.active{
  109. background:#3C7FAF;
  110. color:#ffffff;
  111. }
  112.  
  113.  
  114. .bdy #stsup .para {
  115.     font-family: Arial, Helvetica, sans-serif;
  116.     font-size: 11px;
  117.     font-style: normal;
  118.     color:#07519A;
  119.     word-spacing:3px;
  120.     white-space:normal;
  121.     line-height:20px;
  122.  
  123.     text-align: justify
  124.  
  125. }
  126.  
  127. .bdy #hedr #stsup .ltxt {
  128.     color: #999999;
  129.     height: 12px;
  130.     width: 100px;
  131.     vertical-align:top;
  132.     font:Arial, Helvetica, sans-serif;
  133.     font-size:9px;
  134.     font-style:normal;
  135.  
  136. }
  137. .bdy #wrap #hedr #stsup .lbtn {
  138.     font-family: Arial, Helvetica, sans-serif;
  139.     font-size: 9px;
  140.     height: 20px;
  141.     width: 50px;
  142. }
  143. .bdy #wrap .marqimg {
  144.     background-attachment: scroll;
  145.     background-image: url(innerpages/imgs/berry.png);
  146.     background-repeat: no-repeat;
  147.     background-position: left top;
  148. }
  149.  
  150.  
  151. /*#hedr {
  152.     height: 163px;
  153.     width: 700px;
  154.     position: absolute;
  155.     z-index: 2;
  156. }*/
  157.  
  158. .bdy .footrtbl {
  159. background-color:#EBF3FB;
  160.  
  161. }
  162.  
---------------consult.css---------

Expand|Select|Wrap|Line Numbers
  1. #wrap {
  2.    /* background:#99c;*/
  3.     margin:0 auto;
  4.     width:710px;
  5.     height:600px;
  6. }    
  7.  
  8. #cntnt {
  9.     float:left;
  10.     height: 650x;
  11.     width: 695px;
  12.     border:#CCCCCC solid 1px;
  13.     padding-left:3px;
  14. }
  15.  
  16.  
  17.  
  18. .footr {
  19.     float:left;
  20.     height: 25px;
  21.     width: 698px;
  22.     border:#CCCCCC solid 1px;
  23.     background-color:#EBF3FB;
  24. }
  25.  
  26.  
  27.  
  28. .bdy #cntnt #img1 {
  29.     background-attachment: scroll;
  30.     background-color: #5984AF;
  31.     background-image: url(imgs/coni.jpg);
  32.     background-repeat: no-repeat;
  33.     background-position: left top;
  34.  
  35.     height: 147px;
  36.     width: 144px;
  37.     left: 679px;
  38.     top: 217px;
  39. }
  40.  
  41.  
  42. .bdy #stsup {
  43.     position:relative;
  44.     left: 335px;
  45.     width: 323px;
  46.     height:25px;    
  47.     top: 135px;
  48.  
  49. }
  50.  
  51.  
-----------------menu.css------------
Expand|Select|Wrap|Line Numbers
  1. #nav {
  2.  
  3.     width: 695px;
  4.     padding:5px;
  5.     padding-left:0px;
  6.     padding-top:5px;
  7.     padding-right:5px;
  8.     padding-top:5px;
  9.     background-color:#EBF3FB;
  10. }
  11.  
  12. #nav ul{
  13.     margin:0;
  14.     padding:0;
  15.     font-family:Arial, Helvetica, sans-serif;
  16.     font-size:11px;
  17.     font-style:normal;
  18.     background-color:#EBF3FB;
  19. }
  20.  
  21. #nav li{
  22.     display:inline;
  23.     list-style:none;
  24.     margin:0;
  25.     padding: 3px 35px;
  26.     border-left:#AACCEE solid 1px;
  27. }
  28.  
  29. #nav ul li a {
  30.     text-decoration:none;
  31.     text-align:center;
  32.     background:#EBF3FB;
  33.     color:#07519A;
  34. }
  35.  
  36. #nav li a:hover{
  37. background:#3C7FAF;
  38. color:#FFFFFF;
  39. }
  40.  
  41. #nav li:hover{
  42. background:#3C7FAF;
  43. color:#FFFFFF;
  44. }
  45.  
---------------------------------------

And one thing I also want to set some height to the menu to the menu.
if possible please tell me.

Any suggestions also welcome with pleasure.

Thanks in advance.
Sep 5 '08 #1
1 7691
I am testing in IE6 and Mozilla FF, showing differently

pls checkit
Sep 6 '08 #2

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

Similar topics

0
by: nam | last post by:
could someone please help me with this bizarre problem - I've created a swf file at the top of my html page. The swf file (using Swish) is simply a menu of 5 links to 5 anchor points on the html...
2
by: Astra | last post by:
Hi everybody Need your help. I have a DB-extracted list of say 5 items per page, which have links on each one that takes you to more detailed info on the 'clicked' particular item. When you...
5
by: elsenraat_76 | last post by:
Hello! I was wondering if someone could help me out with a problem I'm having? I'm trying to input a javascript value into an anchor tag (from a function), but don't have an event to call the...
2
by: James | last post by:
I have a forms application which has many controls such as buttons,labels,listviews,text boxes etc. If you set the window size to maximum size so that it would expand to the size of the screen the...
6
by: Richard Brown | last post by:
Ok, I celebrate and rejoice in the Anchor property. So wonderful compared to the horrible 'resize' code I had to write in VB6, there is just no end to the wonders of VB.NET..... uh, ok..... BUT......
5
by: Randy Webb | last post by:
The list below has the current section number, proposed anchor name, and then the current title of that section. Some make sense, some don't. There are a few that don't have proposed anchor names...
5
by: Meadock | last post by:
Here's an example of what i'm trying to do. At www.webpage.com/page1.php, there's a link that points to an anchor at www.webpage.com/page2.php. The syntax is: <a href="page2.php#anchor">Link</a>...
2
by: TheITGuyFromNY | last post by:
To set this up, I have a parent window with a list of things (doesn't matter what they are, but they are loaded by the page dynamically from a database with ASP server-side script. So, next to each...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Sept 2023 starting at 18:00 UK time (6PM UTC+1) and finishing at about 19:15 (7.15PM) The start time is equivalent to 19:00 (7PM) in Central...
0
by: lllomh | last post by:
Define the method first this.state = { buttonBackgroundColor: 'green', isBlinking: false, // A new status is added to identify whether the button is blinking or not } autoStart=()=>{
2
by: DJRhino | last post by:
Was curious if anyone else was having this same issue or not.... I was just Up/Down graded to windows 11 and now my access combo boxes are not acting right. With win 10 I could start typing...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 4 Oct 2023 starting at 18:00 UK time (6PM UTC+1) and finishing at about 19:15 (7.15PM) The start time is equivalent to 19:00 (7PM) in Central...
2
by: giovanniandrean | last post by:
The energy model is structured as follows and uses excel sheets to give input data: 1-Utility.py contains all the functions needed to calculate the variables and other minor things (mentions...
4
NeoPa
by: NeoPa | last post by:
Hello everyone. I find myself stuck trying to find the VBA way to get Access to create a PDF of the currently-selected (and open) object (Form or Report). I know it can be done by selecting :...
1
by: Teri B | last post by:
Hi, I have created a sub-form Roles. In my course form the user selects the roles assigned to the course. 0ne-to-many. One course many roles. Then I created a report based on the Course form and...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 1 Nov 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM) Please note that the UK and Europe revert to winter time on...
3
by: nia12 | last post by:
Hi there, I am very new to Access so apologies if any of this is obvious/not clear. I am creating a data collection tool for health care employees to complete. It consists of a number of...

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.