ok what am I missing...

mm00re · July 22, 2009

This is a simple page that has a menu bar on it and for whatever reason it won't work properly under firefox and only under the i.e. compatability mode will it work. what am I missing as this is driving me nuts! Thanks in advance...

index.php

<?php include '../training/inc/accesscontrol.php'; ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio nal.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="css/default.css" rel="stylesheet" type="text/css" />
<SCRIPT LANGUAGE="JavaScript" SRC="js/CalendarPopup.js"></SCRIPT>
<SCRIPT LANGUAGE="JavaScript">
var cal = new CalendarPopup();
</SCRIPT>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Families  - Mission, Vision, & Values</title>
</head>
<body>
<div id="container">
  <div id="topbar">
    <center>
      <br />
      <br />
      <br />
      <h1>Training menu</h1>
    </center>
    <right>
      <h5 style="text-align:right;">Currently Logged In As: <?echo $uid?></h5>
    </right>
  </div>
  <br />
  <div id="navbar">
    <div id="menu">
      <ul>
      <li>
      <li>
        <h2>Home</h2>
      </li>
      <ul>
        <li><a href="index.php" title="Return Home">Return Home</a></li>
      </ul>
      </li>
    </ul>
    <ul>
      <li>
      <li>
        <h2>My Profile</h2>
      </li>
      <ul>
        <li><a href="index.php?profile" title="Edit my profile">Edit Profile</a></li>
      </ul>
      </li>
    </ul>
    <ul>
      <li>
      <li>
        <h2>FC College</h2>
      </li>
      <ul>
        <li><a href="index.php?training">List My FCC Records</a></li>
        <li><a href="index.php?add-train">Add FCC Training Record</a></li>
        <li><a href="index.php?fcclist">List FCC Programs</a></li>
        <li><a href="index.php?provlist">List Providers</a></li>
      </ul>
      </li>
    </ul>
    <ul>
      <li>
      <li>
        <h2>Reports</h2>
      </li>
      <ul>
        <li><a href="#" title="Not functional yet">Employee by Month</a></li>
        <li><a href="#" title="Not functional yet">Employee by Program</a></li>
        <li><a href="#" title="Not functional yet">Employee total</a></li>
      </ul>
      </li>
    </ul>
    <ul>
      <li>
      <li>
        <h2>Logout</h2>
      </li>
      <ul>
        <li><a href="logout.php" title="Logout of the system">Exit program</a></li>
      </ul>
      </li>
    </ul>
    <br style="clear: left" />
    </div>
    <!-- close #navbar -->
  </div>
  <div id="main">
    <?php
//If is defined URL variable 'signup'
if(isset($_GET['profile'])){
// include page signup
include('pr-edit.php');
//else if is defined URL variable 'login'
} else if(isset($_GET['training'])){
// include page login
include('../training/tr/train-list.php');
//else if is defined URL variable 'about'
} else if(isset($_GET['add-train'])){
// include page login
include('tr-add.php');
//else if is defined URL variable 'about'
}else if(isset($_GET['reports'])){
// Logout the session
include('reports.php');
// in all other cases include the home page
}else if(isset($_GET['provlist'])){
// include page login
include('prov-list.php');
//else if is defined URL variable 'about'
}else if(isset($_GET['admin'])){
// Logout the session
include('admin.php');
// in all other cases include the home page
}else if(isset($_GET['fcclist'])){
// Logout the session
include('fcc-list.php');
// in all other cases include the home page
}else if(isset($_GET['logout'])){
// Logout the session
include('../training/inc/logout.php');
// in all other cases include the home page
}
?>
<div class="spacer">
      <!-- Close #spacer  -->
    </div>
    <!-- close #main content -->
  </div>
  <p>To edit your personal information, click on "Profile"</p>
  <p>To view your training classes attended, click on "My Training List" </p>
  <p>To add a new training record, click "Add Training Record" </p>
  <p>To view available reports, click "Reports"</p>


  <div class="footer"></div>
  <!-- close #container -->
</div>
</body>
</html>

default.css

/*
#container has an absolute width (960 pixel)
The width of inner elements is set to auto,
in this way all inner elements have the same
width of the element which contains them  */

body {
background: #799ac5;
margin: 0px;
padding: 0px;
font: 85%/1.3em Georgia, Arial, Helvetica, sans-serif;
color: #333;
}
#header {
background:url(../images/logo-nontransp.jpg) no-repeat;
height:150px;
}
#container {
background: #799ac5;
width:960px;
margin: 0 auto;
height:auto;
}/*
#logo {
background:url(../images/logo-nontransp.jpg);
height:60px;
}*/
#topbar {
height:160px;
background: #17994c URL(../images/fc_logo2.jpg) no-repeat left top;
;
color:#FFF;
}
#navbar {
width:auto;
display:block;
height:50px;
}
#main {
width: auto;
overflow: auto;
}
* html #main {
height: 1%;
}
#column_left {
width:20%;
margin-right:20px;
float:left;
}
#column_right {
width:80%;
float:left;
}
/*

div.spacer, solve an issue with #container height
in css 2 column layout.

*/

div.spacer {
clear:both;
height:20px;
display:block;
}
#footer {
width:auto;
display:block;
height:24px;
}
/* ------------------------------

------------------------------ */

.even {
background-color: #f2f3f4;
}
.odd {
background-color: #ffffff;
}
tr {
background: #ffffff url(training/images/background.jpg) repeat-y left top;
width:840px;
margin:0 auto;
}
/*-----------------------------
/**************** menu coding *****************/
#menu {
width: auto;
background: #799ac5;
float: center;
text-align:center;/* center the displayed text */
margin-left:140px;/* Center the menu's  */
/*	margin-right:60px;*/
}
#menu ul {
list-style: none;
margin: 0;
padding: 0;
width: 10em;
float:left;
}
#menu a, #menu h2 {
/*font: bold 11px/16px arial, helvetica, sans-serif;*/
font: bold 14px Verdana;
display: block;
border-width: 1px;
border-style: solid;
border-color: #ccc #888 #555 #bbb;
margin: 0;
padding: 2px 3px;
}
#menu h2 {
color: #fff;
background: #c74d38;
text-transform: uppercase;
}
#menu a {
color: #000;
background: #efefef;
text-decoration: none;
}
#menu a:hover {
color: #c74d38;
background: #fff;
}
#menu li {
position: relative;
}
#menu ul ul ul {
position: absolute;
top: 0;
left: 100%;
}
#menu ul ul {
position: relative;
z-index: 500;
}
div#menu ul ul {
display: none;
}
div#menu ul li:hover ul {
display: block;
}
div#menu ul ul, div#menu ul li:hover ul ul, div#menu ul ul li:hover ul ul {
display: none;
}
div#menu ul li:hover ul, div#menu ul ul li:hover ul, div#menu ul ul ul li:hover ul {
display: block;
}
body {
behavior: url("csshover3.htc");
}
<!--
[if IE]> <style type="text/css" media="screen"> body {
behavior: url(csshover3.htc);
font-size: 100%;
}
#menu ul li {
float: left;
width: 100%;
}
#menu ul li a {
height: 1%;
}
#menu a, #menu h2 {
font: bold 1em/1.4em arial, helvetica, sans-serif;
}
</style> <![endif]
-->

/*--------------------------------
Links
-----------------*/
a:link, a:visited {
color:#c74d38;
text-decoration: none;
}
a:hover, a:active {
color:#11793b;
text-decoration: none;
}
a img {
border: 0;
}
a.moreInfo {
display:block;
margin:-2px 5px 2px 0;
float:right;
font: bold 80% "Lucida Sans Unicode", "Lucida Grande", Verdana, sans-serif;
}
/*----Forms layout  ----------------
-------------------------------------------*/
div.row {
clear: both;
padding-top: 5px;
padding-bottom: 5px;
}
div.row span.label {
float: left;
width: 100px;
text-align: right;
}
div.row span.formw {
float: right;
width: 235px;
text-align: left;
}
/* Footer
----------------------------------------------------------------------- */
.footer {
clear:both;
font-size: 80%;
font-family: Arial, Helvetica, sans-serif;
color: #a2d6b7;
text-align: center;
width:960px;
margin: 45px 0 30px 0;
padding-top:50px;
}

haku · July 22, 2009

Try validating your code. You have some errors in there. I don't know if that will help, but it may.

After you validate it, if it's still not working, post the relevant generated HTML (don't include any php, only the HTML that is generated by the php). Not all the html, just the relevant html.

mm00re · July 22, 2009

I ran both the html and css through the w3c validator and after some changes it passes both the html and css checks but weirdly enough the menu works in firefox but now not in i.e.

  14. <body>
  15. <div id="container">
  16. <div id="topbar">
  17. <center>
  18. <br />
  19. <br />
  20. <br />
  21. <h1>Families Count Training</h1>
  22. </center>
  23. <h5 style="text-align:right;">Currently Logged In As: </h5>
  24. </div>
  25. <br />
  26. <div id="navbar">
  27. <div id="menu">
  28. <ul>
  29. <li>
  30. <h2>Home</h2>
  31. <ul>
  32. <li><a href="index.php" title="Return Home">Return Home</a></li>
  33. </ul>
  34. </li>
  35. </ul>
  36. <ul>
  37. <li>
  38. <h2>My Profile</h2>
  39. <ul>
  40. <li><a href="index.php?profile" title="Edit my profile">Edit Profile</a></li>
  41. </ul>
  42. </li>
  43. </ul>
  44. <ul>
  45. <li>
  46. <h2>FC College</h2>
  47. <ul>
  48. <li><a href="index.php?training">List My FCC Records</a></li>
  49. <li><a href="index.php?add-train">Add FCC Training Record</a></li>
  50. <li><a href="index.php?fcclist">List FCC Programs</a></li>
  51. <li><a href="index.php?provlist">List Providers</a></li>
  52. </ul>
  53. </li>
  54. </ul>
  55. <ul>
  56. <li>
  57. <h2>Reports</h2>
  58. <ul>
  59. <li><a href="#" title="Not functional yet">Employee by Month</a></li>
  60. <li><a href="#" title="Not functional yet">Employee by Program</a></li>
  61. <li><a href="#" title="Not functional yet">Employee total</a></li>
  62. </ul>
  63. </li>
  64. </ul>
  65. <ul>
  66. <li>
  67. <h2>Logout</h2>
  68. <ul>
  69. <li><a href="logout.php" title="Logout of the system">Exit program</a></li>
  70. </ul>
  71. </li>
  72. </ul>
  73. <br style="clear: left" />
  74. </div>
  75. <!-- close #navbar -->
  76. </div>
  77. <div id="main">
  78. <div class="spacer">
  79. <!-- Close #spacer -->
  80. </div>
  81. <!-- close #main content -->
  82. </div>

haku · July 22, 2009

How does it not work?

mm00re · July 22, 2009

In i.e. whenever I move my cursor over the menu none of the items drop down nor are any links displayed. I can pm you the url if you would like to view it yourself.

This is why it has been driving me crazy. :'(

Sign In

ok what am I missing...

Recommended Posts

mm00re

Link to comment

Share on other sites

haku

Link to comment

Share on other sites

mm00re

Link to comment

Share on other sites

haku

Link to comment

Share on other sites

mm00re

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information