BUG - SpryMenu Bar submenu

I've posted a page that is using default styles from the
menubar spry widget. I've not monkeyed with this code at all, just
renamed the .css and .js files to make links work without screwing
up entire site. This is version 1.6.1.
The submenu on this page is aligned with the top of the
parent menu instead of next to it's parent item in the main menu
(Item 3). When you mouse over Item 3, the submenu appears at it's
correct location. There seems to be a problem with how IE7 handles
the MenuBarSubmenuVisible class. It works correctly in FF and
Safari.
Test Page:<
http://www.vwc.com/ATC138_test/SpryMenuBarVert_Test.html>.
JS:<
http://www.vwc.com/ATC138_test/SpryAssets/SpryMenuBarTemplt.js>.
CSS:<
http://www.vwc.com/ATC138_test/SpryAssets/SpryMenuBarVerticalTemplt.css>.
Spry experts, please take a look and offer a fix.
Thanks.

I'm having the same problem. They align to the right and the
submenu that and the second submenu aligns about one inch away from
the main submenu to the right.

Similar Messages

Multiple Sprymenu bars, submenu's apearing on top of page

Hi,
I need to use multiple sprymenu's for one website.
So I created them and made multiple stylesheets for every bar one.
In Firefox everything is working great but (offcorse) in IE it isnt.
The top one is working good in IE but the following ones not.
The submenu's are appaering on top of the page instad of underneeth the menubar.
Can someone please help.
www.digitalportal.nl/testmenu/menu/TESTMENU.html
Thanx.
Sanne

Have a look at the following
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Untitled Document</title>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" />
<style>
ul#MenuBar2.MenuBarHorizontal a:hover,
ul#MenuBar2.MenuBarHorizontal a:focus,
ul#MenuBar2.MenuBarHorizontal a.MenuBarItemHover,
ul#MenuBar2.MenuBarHorizontal a.MenuBarItemSubmenuHover,
ul#MenuBar2.MenuBarHorizontal a.MenuBarSubmenuVisible {
    background-color: red;
    color: #FFF;
</style>
</head>
<body>
<div class="menu">
<ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a class="MenuBarItemSubmenu" href="#">Werknemers</a>
      <ul>
        <li><a href="#">Item 1.1</a></li>
        <li><a href="#">Item 1.2</a></li>
        <li><a href="#">Item 1.3</a></li>
      </ul>
    </li>
    <li><a href="#">Wijzigingen</a></li>
    <li><a class="MenuBarItemSubmenu" href="#">Overzichten</a>
      <ul>
        <li><a href="#">Item 3.1</a>        </li>
        <li><a href="#">Item 3.2</a></li>
        <li><a href="#">Item 3.3</a></li>
      </ul>
    </li>
    <li><a href="#">Functies</a></li>
    <li><a href="#">Inbox</a></li>
    <li><a href="#">Ref. gegevens</a></li>
    <li><a href="#">Log</a></li>
</ul>
</div>
<div class="menu" style="clear:both;">
<ul id="MenuBar2" class="MenuBarHorizontal">
    <li><a class="MenuBarItemSubmenu" href="#">Algemeen</a>
      <ul>
        <li><a href="#">Item 1.1</a></li>
        <li><a href="#">Item 1.2</a></li>
        <li><a href="#">Item 1.3</a></li>
      </ul>
    </li>
    <li><a href="#">Pensioen</a></li>
    <li><a class="MenuBarItemSubmenu" href="#">ANW</a>
      <ul>
        <li><a href="#">Item 3.1</a>        </li>
        <li><a href="#">Item 3.2</a></li>
        <li><a href="#">Item 3.3</a></li>
      </ul>
    </li>
    <li><a href="#">WIA-producten</a></li>
    <li><a href="#">Basisverzekering</a></li>
    <li><a href="#">Collectieve ongev.</a></li>
    <li><a href="#">Levensloop</a></li>
</ul>
</div>
</div>
<script src="SpryAssets/SpryMenuBar.js"></script>
<script>
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>
I have used the one original CSS and make my overriding changes by using the ID of the menu.
Gramps

Help with vertical spry menu bar submenu displaying incorrectly!

I’m new to Dreamweaver and am learning as I go. I am having a problem with the vertical spry menu bar submenu in the Live View. When I scroll over the spry menu bar option that has a submenu, the submenu appears in the upper right hand corner of my screen. (My menu bar is going down the left hand side.) However, when I preview it in Internet Explorer it looks fine after I allow the Java Script to run or the Active X controls, which my browser usually automatically blocks. (The browser just displays a small message along the top and I click on it to allow it.) To get it to do this much, I had to play around with the CSS for the spry menu bar a little bit.
Before, when I clicked on the Live View option, a small message ran along the top in Dreamweaver saying it couldn’t find the Flash Plugin and asked me to download the most recent FlashPlayer, which I did twice. It continued to say that and then I just closed that message that kept popping up, but I think that has something to do with the problem. I then researched that problem in the Spry Framework Help and Dreamweaver Help, but couldn’t find a solution that worked. (Someone had posted a link for downloading the Flash Player for Netscape Navigator, but that didn’t seem to do anything.)
Please also note that I am using one of Dreamweaver’s pre-built layouts. I don’t know if that makes a difference with this problem.
How do I fix this problem so that it displays correctly in the LiveView? And will the message that I get on my browser about allowing blocked content appear on other people’s computer when they open my website?

IE is a big problem child among browsers. Don't use it as your default browser.
For best results, build your site to display & perform well in the web standards browsers like Firefox, Chrome, Safari & Opera. If it works in one, it should work pretty much the same in all of them.
After you're satisfied with how your site looks in the good browsers, then test in IE. If needed, add hacks or conditional comments to make IE behave. There are many web sites that discuss known bugs in IE and how to work around them.
Lastly, the active X nag screens only appear locally. Once deployed on the remote server, you won't see them.
For better answers to your layout questions, we need to see your page. Can you post a URL?
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Two (2) Sprymenu bar problems

Hi, there're two issues I need some help:
1) I inserted a sprymenu bar (lateral) in the maincontent
area. In the CSS properties, I set "padding" to 0. When I load the
page into IE browser, it looks OK. However, when I change to
Firefox 3, there's an extra space shown between the top of the menu
bar and the bottom of the logo image. I have no clue what could be
wrong.
2) I wanted to set the menu bar to extend the entire
available width: starting from the left edge of the image and
ending at the right edge of the image. I need some tips on how to
configure it.
Here's the link to the page,
http://www.greenteacritique.com/
Thanks.

Hello,
Put a border: 1px solid lightgreen; or what ever color u need
in to the ul.MenuBarHorizontal. that should solve your distance
problem in firefox. Another one hmm... ...don't know ATM.

Spry Menu Bar Submenu won't show in Safari or Dreamweaver LiveView

I am trying to get my submenu to show up on my website's spry menu bar. It will show up when I test the site using firefox or IE but it won't show when I try LiveView in Dreamweaver or when I test using Safari. The site is www.fuseut.com/fuse
Here are is the CSS for the menubar:
@charset "UTF-8"; /* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */ /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */ /******************************************************************************* LAYOUT INFORMATION: describes box model, positioning, z-order *******************************************************************************/ /* The outermost container of the Menu Bar, an auto width box with no margin or padding */ ul.MenuBarHorizontal {      margin: 0;      padding: 0;      list-style-type: none;      font-size: 100%;      cursor: default;      width: auto; } /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */ ul.MenuBarActive {      z-index: 1000; } /* Menu item containers, position children relative to this container and are a fixed width */ ul.MenuBarHorizontal li {      margin: 0;      padding: 0;      list-style-type: none;      font-size: 100%;      position: relative;      text-align: left;      cursor: pointer;      width: 125px;      float: left;      font-family: "MS Serif", "New York", serif;      overflow: visible; } /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */ ul.MenuBarHorizontal ul {      margin: 0;      padding: 0;      list-style-type: none;      font-size: 100%;      z-index: 50;      cursor: default;      width: 7em;      position: absolute;      left: -1000em; } /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */ ul.MenuBarHorizontal ul.MenuBarSubmenuVisible {      left: auto; } /* Menu item containers are same fixed width as parent */ ul.MenuBarHorizontal ul li {      width: 7em; } /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */ ul.MenuBarHorizontal ul ul {      position: absolute;      margin: -5% 0 0 95%; } /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */ ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible {      left: 0;      top: 0; } /******************************************************************************* DESIGN INFORMATION: describes color scheme, borders, fonts *******************************************************************************/ /* Submenu containers have borders on all sides */ ul.MenuBarHorizontal ul {      border: 1px solid #CCC; } /* Menu items are a light gray block with padding and no text decoration */ ul.MenuBarHorizontal a {      display: block;      cursor: pointer;      padding: 0.5em 0.75em;      color: #FFF;      text-decoration: none;      font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;      text-align: center;      background-image: url(../menubgdefault.png); } /* Menu items that have mouse over or focus have a blue background and white text */ ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus {      color: #FFF002;      font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; } /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */ ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible {      color: #FFF002;      text-decoration: underline;      font-weight: bold; } /******************************************************************************* SUBMENU INDICATION: styles if there is a submenu under a given menu item *******************************************************************************/ /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */ ul.MenuBarHorizontal a.MenuBarItemSubmenu {      background-image: url(SpryMenuBarDown.gif);      background-repeat: no-repeat;      background-position: 95% 50%;      background-color: #999; } /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */ ul.MenuBarHorizontal ul a.MenuBarItemSubmenu {      background-image: url(SpryMenuBarRight.gif);      background-repeat: no-repeat;      background-position: 95% 50%; } /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */ ul.MenuBarHorizontal a.MenuBarItemSubmenuHover {      background-image: url(SpryMenuBarDownHover.gif);      background-repeat: no-repeat;      background-position: 95% 50%; } /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */ ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover {      background-image: url(SpryMenuBarRightHover.gif);      background-repeat: no-repeat;      background-position: 95% 50%; } /******************************************************************************* BROWSER HACKS: the hacks below should not be changed unless you are an expert *******************************************************************************/ /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */ ul.MenuBarHorizontal iframe {      position: absolute;      z-index: 1010;      filter:alpha(opacity:0.1); } /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */ @media screen, projection {      ul.MenuBarHorizontal li.MenuBarItemIE      {           display: inline;           f\loat: left;           background: #FFF;      } }
And here is the HTML code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>FUSE UT</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<script src="SpryAssets/xpath.js" type="text/javascript"></script>
<script src="SpryAssets/SpryData.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>
<script type="text/javascript">

</script>
<meta name="Keywords" content="fuse ut utk university of tennessee tommy jervis avery howard ross rowland angie sessoms sga campaign elections" />
</head>
<body>
<div id="container">
<div id="header">
</div>
<div id="menubarparent" style="z-index: 20; position: absolute; overflow: visible;">
<div id="menubar" style="z-index: 10;">
<ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a href="index.html">FUSE</a>      </li>
    <li><a href="senators.html" class="MenuBarItemSubmenu">Senators</a>
      <ul>
        <li><a href="#">Untitled Item</a></li>
      </ul>
    </li><li><a href="executive.html">Executive</a>      </li>
    <li><a href="policy.html">Policy</a></li>
    <li><a href="organizations.html">Organizations</a></li>
    <li><a href="bios.html" class="MenuBarItemSubmenu">Bios</a>
      <ul>
        <li><a href="#">Untitled Item</a></li>
      </ul>
    </li>
</ul>
</div>
</div>
<p>
<p>
<div id="apDiv1">
    <div id="apDiv4"></div>
    <object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="550" height="265" wmode="transparent">
      <param name="movie" value="Components/CandidatesHomeSlideshow.swf" />
      <param name="quality" value="high" />
       <param name="wmode" value="transparent" />
      <param name="swfversion" value="6.0.65.0" />
      
      <param name="expressinstall" value="Scripts/expressInstall.swf" />
      
      
      <object type="application/x-shockwave-flash" data="Components/CandidatesHomeSlideshow.swf" width="550" height="265" wmode="transparent">
        
        <param name="quality" value="high" />
          <param name="wmode" value="transparent" />
        <param name="swfversion" value="6.0.65.0" />
        <param name="expressinstall" value="Scripts/expressInstall.swf" />
        
        <div>
          <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
          <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
        </div>
        
      </object>
      
    </object><div id="HomeEvents">
      <p> </p>
      <p> </p>
      <div id="EventsXML">
        <div spry:region="event2">
          <dl spry:repeatchildren="event2">
            <dt>{date}</dt>
            <dd>{title}</dd>
            <dd>{location}</dd>
          </dl>
        </div>
      </div>
    </div>
</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</div>
<script type="text/javascript">

</script>
</body>
</html>
Sorry if it's something really basic...I'm a noob to web design.
Thanks!

Don't use reserved words in JS
var event = new Spry.Data.XMLDataSet("events.xml", "catalog/event", {sortOnLoad: "date", sortOrderOnLoad: "descending"});
event is such a reserved word. If you change this to event1 then all is well.
I hope this helps.
Ben

Menu Bar SubMenu position issue

Hi,
I have an horizontal menu on my site which works, but I'm
starting a new version of the site and there my submenus display in
a weird position (in IE only) and with a transparent background.
I read about the z-index bug, but couldn't find or understand
the solution.
I would appreciate if someone could have a look and help me:
Current version with the menu bar working fine:
http://www.thebaysoccer.com
Test page of the new version where my problem appears:
http://www.thebaysoccer.com/new%20tbs/test.html
Thanks!

Hello,
The trouble is the fact that IE applies text-align:center to
more things
than just text.
You applied it to the li CSS. This not only centers the text
in IE, but also
the <ul> (which are your submenus) within these
<li>.
ul.MenuBarHorizontal li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 12px;
position: relative;
text-align: center; <********
cursor: pointer;
width: auto;
float: left;
white-space: nowrap;
You also have it in the ul.MenuBarHorizontal style.
So, in IE the left edge of the <ul> (submenu) is
aligning with the center of
the <li> it is contained in.
That's why the sub menu drops down with the left edge at the
middle of the
main nav "button".
Remove those "text-align:center" rules.
To center your menu text, apply text-align:center to the link
style instead,
like so:
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
background-color: #333;
padding: 0.5em 0.75em;
color: #EEE;
text-decoration: none;
text-align: center;
As far as the submenu background, notice "fixed width" in the
comment line
above the following rule in the spry CSS.
You had yours set to auto.
Try this:
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
width: 10em;
background-color: transparent;
Take care,
Tim
"Tilt_Paris" <[email protected]> wrote in
message
news:fvda4t$4pa$[email protected]..
> Hi,
>
> I have an horizontal menu on my site which works, but
I'm starting a new
> version of the site and there my submenus display in a
weird position (in
> IE
> only) and with a transparent background.
>
> I read about the z-index bug, but couldn't find or
understand the
> solution.
>
> I would appreciate if someone could have a look and help
me:
>
> Current version with the menu bar working fine:
>
http://www.thebaysoccer.com
>
> Test page of the new version where my problem appears:
>
http://www.thebaysoccer.com/new%20tbs/test.html
>
> Thanks!
>

Horizontal menu bar -- submenu display

Hi, everyone --
This is my first post here, and my first time using spry. I
am trying to set up my horizontal menu bar so that the submenus
open up horizontally -- instead of vertically -- below the parent
menu item. (If the submenu list opens up vertically below the
parent item it takes up too much space.)
Any suggestions?
Thanks so much!
Lisa

Found topic.
http://www.adobe.com/cfusion/webforums/forum/messageview.cfm?forumid=72&catid=602&threadid =1381916&highlight_key=y

Spry H-Bar SubMenu Placement

I hope I can get a little help with a problem I have come across.
Background: I am creating a page with 3 separate horizontal Spry Menus, each menu is contained in a cell of a 1 row 3 column table. I created the first menu so it looks like I want it to, to do so I had to insert a few local css rules to override the separate css file as per a suggestion on adobe's site. Everything works as I desire in Firefox and IE8.
Next i created the 2nd menu in the 2nd cell and renamed the class to "MenuBarHorizontal2" and proceded to replciate both the local and seperate css rules and renamed all the replicas to match the modified 2nd menu. I realize this is probably a monkey force round peg in square hole approach, but it worked.. mostly.
Issue: When viewed in Firefox everythign looks as I intend, but when viewed in IE8 the 2nd menu has an issue. The 2nd menu's submenu area appears at the top of the page directly over the menu bar instead of below it like the first menu. I have yet to insert the 3rd menu, but I expect a similar issue form it so I have held off.
I will attach the page in question, and both css sheets for you to view. In addition you can view the page online at http://www.ecotulips.com/test.htm
I appreciate any help with this issue as I am doing this site as a wedding gift for my sister.

Hi,
I notice that you have menubar and other styles both as linked external style sheets AND as style sheets in the head of your document.
This will do nothing but confuse things. If you can keep all your styles in distinct, external style sheets, you will better be able to trace sources of difficulty, as the cascade of styles will be simpler to read.
Regarding your page with
3 separate horizontal Spry Menus, each menu is contained in a cell of a 1 row 3 column table. I created the first menu so it looks like I want it to, to do so I had to insert a few local css rules to override the separate css file as per a suggestion on adobe's site.
I think that you can achieve the effect you want with a single Spry Menubar with three drop down menus all on the same menu bar. Take a look at supporting video: http://www.adobe.com/designcenter/video_workshop/?id=vid0168
As you have found, by trying to use your "Number 12 forcefit" (round peg in a square hole), you have leaped over more careful construction techniques into a heap of difficulty. If you go back and remove the menubars that you have inserted...click anywhere on one, click the blue tab on the surrounding div, and strike the delete key, everything will hopefully fall back into pre-menu condition.
When you insert the menubar, you will find it totally editable, CSS style-wise.
Z

Menu Bar - submenu will not work.

On my main template I have deleted my Menu Bar twice to see if I had coded something funky. I am experiencing no submenu at all. Looking at the website "un-forgetables.com," when you rollover or click on the menu bar that leads to submenus you will get nothing. With the following screenshot of the code can you idenify my problem.
Thanks in advance.
<%@LANGUAGE="JAVASCRIPT" CODEPAGE="65001"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>Unforgetables Template 3</title>



<link href="../unforgetable.css" rel="stylesheet" type="text/css">
<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
</head>
<body class="oneColLiqCtrHdr">
<div id="container">
<div id="header">
    <p><img src="../Images/unforgetables_logo.jpg" alt="Unforgetables Logo" width="448" height="201" class="banner" longdesc="file:///C|/Documents and Settings/Janie/My Documents/Unforgetables website/Images/unforgetables_logo.jpg"></p>
    
</div>
<ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a href="../index.html">Home</a>    </li>
    <li><a href="#" class="MenuBarItemSubmenu">Planning/Consulting</a>
      <ul>
        <li><a href="../plan consult/pc who pays what.html" class="MenuBarItemSubmenu">Weddings</a>
          <ul>
            <li><a href="../plan consult/pc who pays what.html">Who Pays for What?</a></li>
            <li><a href="../plan consult/pc wed timeline.html">Wedding Planning Timeline</a></li>
            <li><a href="../plan consult/pc why hire.html">Why Hire a Consultant?</a></li>
            <li><a href="../plan consult/pc services available.html">Services Available through "Unforgetables"</a></li>
            <li><a href="../plan consult/pc information.html">Information</a></li>
            <li><a href="../plan consult/pc contract.html">Contract</a></li>
          </ul>
        </li>
        <li><a href="#" class="MenuBarItemSubmenu">Other Events</a>
          <ul>
            <li><a href="../plan consult/pc other events.html">Packages & Prices</a></li>
            <li><a href="../plan consult/pc contract.html">Contract</a></li>
          </ul>
        </li>
        <li><a href="../plan consult/pc weddings we've done.html">Pictures of Weddings We've Done</a></li>
      </ul>
    </li>
    <li><a class="MenuBarItemSubmenu" href="#">Venue/Event Room</a>
      <ul>
        <li><a href="../venue event room/event room pictures.html">Pictures</a>        </li>
        <li><a href="../venue event room/venue event room.html">Description & Price</a></li>
</ul>
    </li>
    <li><a href="#" class="MenuBarItemSubmenu">Rental</a>
      <ul>
        <li><a href="../rental/rental & price list.html">Items & Prices</a></li>
        <li><a href="../rental/rental policy.html">Terms-Conditions-Policies</a></li>
      </ul>
    </li>
    <li><a href="#" class="MenuBarItemSubmenu">Shop On Line</a>
      <ul>
        <li><a href="../shop on line/towel cakes all occ.html">Towel Cakes</a></li>
        <li><a href="../shop on line/diaper cakes.html">Diaper Cakes</a></li>
        <li><a href="../shop on line/christmas towels.html">Other Cakes</a></li>
        <li><a href="../shop on line/diaper bags.html">Diaper Bags</a></li>
        <li><a href="../shop on line/monkeys.html">Monkeys</a></li>
      </ul>
    </li>
    <li><a href="../contact us/contact info.html">Contact Us</a></li>
</ul>
<div id="mainContent">

<p>Hello Hello Hello</p>
<p> </p>

    
</div>
<div id="footer">
    <p>3952 E. 42nd Street, Suite K, Odessa, Texas 79762<br>
    phone 432-550-7300 - fax 432-550-7303
      
    </p>
</div>
</div>
<script type="text/javascript">

</script>
</body>
</html>

You have applied the class "banner" to an image, but defined it as a div. Do this instead (you won't need to alter the dimensions of the class):
<div class="banner"><img src="Images/unforgetables_logo.jpg" alt="Unforgetables Logo" longdesc="file:///C|/Documents and Settings/Janie/My Documents/Unforgetables website/Images/unforgetables_logo.jpg" height="160" width="437"></div>
I notice that you have a long description that points to an image on your hard drive. I don't think you intended that, so I would delete it.
I've pared down the definition for .banner:This will center.
.banner {
    border: 30px solid #000;
    background: #FFF;
    width: 448px;
    margin: 0 auto;
    padding: 10px;
To center the menubar, you need to put it in a div that is centered. I have made the style inline, but you should define it as a #nav or some other div id:
<div style="width: 800px; margin: 0 auto;"><ul id="MenuBar1" class="MenuBarHorizontal">
...all the menubar ul through the </ul>...
</div> to close the new div
This is what you should do in the stylesheet:
#nav {
     width: 800px; /*test this width out...you can adjust to suit */
     margin: 0 auto;
Then you can call it in the html: <div id="nav">...</div>
Remember that to center a div, it needs a width; then apply the margin: top right bottom left; like this: margin: 0 auto; to center
Beth

Illustrator bug- menu bar all messed up, and it keeps crashing

I have the weirdest bug on my trial version- the menu bar on top appears with $$$ signs and all messed up, and crashes constantly. I tried to delete and reinstall illustrator (I downloaded a trial version of the basic creative suite with Illustrator, Photoshop and InDesign, but had the bug only on Illustrator. I even reinstalled Leopard (and in the first installation it was a brand new iMac), which also did not help, so I have no idea what to do. Has anyone else had the problem or knows what to do?
Thanks!
Dotan

i had continual illustrator cs4 freezes in relation to the menus and some file types as well. (win 7 prof 64 bit)
But I found it it worked in a newly created user profile fine.
After having shelled out 3500.- eur for the masters colletion, I was rather dissapointed to find that i have to dig into my pocket for support when the software breaks. The solution is pretty simple assumabley known and could have been answered in two lines of text instead of the useless prefab answers i got.
But first I have to join the general gripe about the stability of illustrator and flash in paticular. It is obvious that each product is created by different teams who do not share common standards. Inexplicable.
Quark never cared about their customers while they were market leader either, remember that, Adobe?
Their frustration became your success. It might pay to remember that part of your history.
I solved the problem by replacing the entire settings folder with the one from the functional profile
C:\Users\user-name\AppData\Roaming\Adobe\Adobe Illustrator CS4 Settings
save any custom color sets, etc first.
three days of hair pulling for a 12 second solution.
Thanks, Adobe!
My motivation to pay another 1200.- for an upgrade is somehow shrinking very, very quickly.

Fix for UI Rendering Bugs (status bar, safari, othe windows "over zoomed")?

Anyone else seen these visual bugs in the UI:
* In vertical mode only the clock is displayed in the status bar. The contents of the status bar are "zoomed in" so much that the signal strength icon on the left and the battery indicator on the right are off the screen and out of view. Neither have ever been displayed (in vertical orientation) since I got the phone two days ago. The characters are over-sized and fuzzy, even clipped across the top of the screen.
* When a dialog box comes up on top of the current application (e.g. prompt to join a WiFi network), only a fraction of the dialog fits on the screen. The UI of the dialog is zoomed in too far, the text is large and fuzzy. The application UI below (seen through the transparency of the dialog) appears okay.
* After a settings reset, Safari works okay for a few minutes, but eventually gets zoomed in so far that the URL field at the top and the button bar across the bottom are no longer visible.
* Switching back and forth from vertical to horizontal (e.g. in music or Safari) sometimes shows the full status bar as expected (signal indicator, time, battery) and sometimes shows only the time (zoomed and fuzzy). Sometimes no status bar is displayed at all (black).
I've tried...
* resetting settings
* resetting settings & removing all data
* full factory default/software restore
None of this helps. Any ideas? Is this a software bug, or is there potentially some hardware defect causing the software to act so whacky?
Thanks for any help/pointers.
HP Windows Vista

Apple has confirmed that my phone has some defect and should be replaced. Thanks.

Spry menu bar submenu disappears when cursor changes

Hello.
I've been working with a spry menu bar for some time, but when I expand the submenu and then move the cursor over some text on the page (where the sub-menu is on top of), the submenu disappears. In other words, it seems that when the cursor changes from a pointer to a text cursor, the submenu disappears.
Can anyone tell me how to prevent that from happening?

LICAP Webmaster wrote:
Can anyone tell me how to prevent that from happening?
Sorry, but without a link to your online page, it's a time-wasting, error-prone guessing game.
If you put your test page and all dependent files online, and post a link here, we will gladly check that:
    Your server is working
    That all required HTML code is correct
    That your folder hierarchy is correct
    That all required dependent files (HTML, CSS, JS, Images etc.) are uploaded to proper folders
    That Javascript Versions are correct
    That link paths are all correct and case sensitive
Sounds like your submenus may be positioned with a small gap from your top-level links

Spry Menu Bar Submenu not dropping.

Hi,
I,ve got a problem with the Spry Bar Menu Bar....The Submenu is not dropping when I preview the page in a browser. Would be great if somebody could help me out here.
Many thanks in advance.

Hello Wiebke,
to my knowledge that's not a reason. Murray has often answered to ftp problems, last thing I've noticed was: "If the files are being uploaded to the correct location, then they must overwrite the existing files in that location. If you are not seeing those changes in the browser, then you must be looking at a stale page in the browser - dump your local browser cache and try again. So, make sure that the files are being properly uploaded, and that your browser is fully refreshed." and from osgood "Have you tried an alternative ftp upload client other than Dreamweaver?".
The last hint is that what I prefer. In all in these cases I'm not a friend of a detailed troubleshooting. It is one of the reasons that I prefer an external FTP program. The difficulties with which you have to fight encourage me in this opinion, not least because we always search for experts, we don't charge a "jack of all trades".
For this reason, to manage, for example, several websites or to upload my files and sometimes for the opposite way, for a necessary download from my server or to use a "a site-wide synch", I'm using FileZilla. It simply looks easier for me to keep track of all operations precisely and generate or reflect easily the desired tree structure.
Above all, FileZilla has a feature (translation from my German FileZilla) called "compare file list". Here it's possible to use file size or modification time as a criterion. There is also the possibility to "hide identical files", so that only these files which you want to redact remain visible.
And even if it means you have to install a new program, I am convinced that there is an advantage. Here is the link to get it and where you can read informations about how it works:
http://filezilla-project.org/ and
http://wiki.filezilla-project.org/Tutorial#Using_the_site_manager
Mac: Mac OS X
http://filezilla-project.org/download.php
Of course, you also need all the access data to reach your server.
Good luck
Hans-Günter

Spry Horizontal Menu bar - submenu position

I'm new to spry so apologies in advance if this has been
posted before.......
I'm putting together a new site using the spry horizontal
menu bar - I've managed to put together a CSS format which works
well in both FireFox and IE7 EXCEPT for the position of the
sub-menus below the main menu bar. IE7 seems to position the sub
menu relative to the top right corner of the parent menu item.
Firefox seems to position it relative to the bottom left corner -
and I can't find a solution which works for both browsers. Any
ideas?

You must have fixed it in the meantime as I see no problem.
Gramps

Menu Bar Submenu Placement

MenuBar Widget, v1.5 on CSS and js files.
The submenus show up correctly on Mac Safari, but on both Mac
Firefox and Camino the submenus overlap the main menu.
I've no doubt changed something I shouldn't have but I've no
idea what.
The page can be viewed
here. The CSS is
here.

I got this worked out, but I'm not sure of the origin.
Something I changed, no doubt.
My first problem was that the Menu Bar was padded left 50 or
so pixels, but had no such padding applied anywhere I could see.
(It had top-bottom margins as well.) So I had added a style to the
eclosing cell taking away the margins and padding. Fixed that in
Safari, but upon checking in Firefox Mac and Camino, the submenus
were then placed directly over the main menu.
After hours of fiddling, I found the style I added was one
source of the problem. Removing that let the submenus be placed
properly. But that left me with the unnecessary left padding (and
top-bottom margins) again.
I finally fixed that by adding some style thusly:
quote:
<ul id="MenuBar1" class="MenuBarVertical"
style="padding: 0; margin: 0;">
If anyone knows of a better way, please tell me.
I've been working at home and don't have access to a Windows
machine. If someone could check this
here I'd appreciate
it.

BUG - SpryMenu Bar submenu

Similar Messages

Maybe you are looking for