Jump to content

Archived

This topic is now archived and is closed to further replies.

dst_u

Center PHP Layers Menu in IE

Recommended Posts

Hello,

I spent a few hours fighting the horizontal php layers menu.

When the page is aligned to the left, it's working perfectly, but if I put inside a table and center it, the sub-menus are not below the header menu. Itis related to the stylesheet, but whatever I tried is not working, and frankly speaking, it's starting to drive me nuts.

BTW, it only happens with IE. With Firefox, everything is OK.

This is my code (on the main page):
[code]
<body>
<table width="785" border="0" cellpadding="1" cellspacing="2" style="height:198px;" align="center">
<tr>
    <td style="position:relative; left:0px; top:0px;" width="548" align="left" valign="top">
<?php
$mid->printMenu('hormenu1');
?>
<?php
$mid->printFooter();
?>
</td>
</tr>
</table>
</body>
[/code]

The relevant css is the following:
[code].submenu {position: absolute; left: 0px; top: 0px; visibility: hidden; display: block; border: thin; font: bold}
[/code]
When I change it to relative, I lose the sub-menu. I also played around with the visibility, table/cell alignments... Nothing works.

Please help.

Thanks  ???

David

Share this post


Link to post
Share on other sites
When I tried to put the full page (include all the php requires), I failed to post the message.

This is the full css file (one of 2 used):
[code]
@charset "iso-8859-1";


.horbar {color: #101C7B;}

.horbaritem {font-family: bitstream vera sans, luxi sans, verdana, geneva, arial, helvetica, sans-serif; font-size: 12px; color: #101C7B}

.horbaritem a {display: block; text-decoration: none; width: 91px}

.horbaritem a:link {color: #101C7B; text-decoration: none; font: bold}

.horbaritem a:visited {color: #101C7B; text-decoration: none; font: bold}

.horbaritem a:hover {color: #4A79D6; text-decoration: none; font: bold}

.horbaritem a:active {color: #4A79D6; text-decoration: none; font: bold}

.verbar {color: #101C7B; background-color: #FFFFFF; border: 2px outset #cecac1; font: bold}

.submenu {position: absolute; left: 0px; top: 0px; visibility: hidden; display: block; border: thin; font: bold}

.subframe {position: relative; display: block; background-color: #FFFFFF; border: 2px outset #cecac1; font: bold}

.item {font: bold; font-family: bitstream vera sans, luxi sans, verdana, geneva, arial, helvetica, sans-serif; font-size: 12px; text-align: left; white-space: nowrap; display: block; border: thin}

.item a {display: block; font: bold; position: relative; text-decoration: none; color: #101C7B; border: 1px outset #101c7b; border-bottom: 1px}

.item a:link {color: #101C7B; font: bold; text-decoration: none; border: 1px outset #101C7B; display: block; border-bottom: 1px}

.item a:visited {color: #101C7B; font: bold; text-decoration: none; border: 1px outset #101C7B; display: block; border-bottom: 1px}

.item a:hover {background-color: #ffffff; color: #4A79D6; font: bold; text-decoration: none; border: 1px outset #101C7B; display: block}

.item a:active {color: #4A79D6; font: bold; text-decoration: none; border: 1px outset #101C7B; display: block; bottom: ; border-bottom: 1px}

/* right: 4px; */
.item .fwdarr {position: relative; top: 5px; right: 7px;}

/* top right bottom left */
.separator {background-color: #ff0000;  border-top: 1px solid #9e9a91;  border-bottom: 1px solid ##101C7B;  margin: 2px 0px 2px 1px;    height: 0;  font-size: 1px;  line-height: 0;}
[/code]

That's the other one used:
[code]@charset "windows-1255";
body {
margin: 0;
padding: 0;
}

.normal {
font-family: bitstream vera sans, luxi sans, verdana, geneva, arial, helvetica, sans-serif;
font-size: 13px;
color: #000000;
}

.normalbox      {
border: 1px solid #440000;
margin: 3px;
padding: 5px;
background-color: #ffffff;
}

.h1 {
text-align: center;
font-family: bitstream vera sans, luxi sans, verdana, geneva, arial, helvetica, sans-serif;
font-size: 22px;
font-weight: bold;
color: #880000;
}

.titlebox      {
border: 1px solid #440000;
margin: 6px;
padding: 0px;
background-color: #fefaf1;
}

a:link {
text-decoration: none;
color: #003300;
}

a:visited {
text-decoration: none;
color: #726461;
}

a:hover {
text-decoration: none;
color: #841212;
}

a:active {
text-decoration: none;
color: #ff0000;
}
[/code]

Share this post


Link to post
Share on other sites
I'm trying (I just tried again), but I get a server disconnect error.

If you dowload the php layers menu (http://phplayersmenu.sourceforge.net/) and check the horizontal menu example, you'll see the libs and javascripts called.

This is part of the <head>, although not all and not exactly, since this is the only thing I managed to post here:
[code]

require_once $myDirPath . 'lib/PHPLIB.php';
require_once $myDirPath . 'lib/layersmenu-common.inc.php';
require_once $myDirPath . 'lib/layersmenu.inc.php';

$mid = new LayersMenu(6, 7, 2, 1);
$mid->setMenuStructureFile($myDirPath . 'menu-residential.txt');
$mid->setIconsize(16, 16);
$mid->parseStructureForMenu('hormenu1');
$mid->newHorizontalMenu('hormenu1');

$mid->printHeader();

[/code]

Share this post


Link to post
Share on other sites
Attached, I posted 2 images: ff.jpg is the menu (when I hover the "About US") using FireFox. ie.jpg is the result I get in Internet Explorer.

[attachment deleted by admin]

Share this post


Link to post
Share on other sites

×

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.