Ie Spry Menu help

Hey guys,
Im building a site with a spry menu on the left hand side. It
looks good in Safari but the dimensions are bad in ie. Can you tell
me what I'm doing wrong?
www.thecorpsofexcellence.org
Thanks for your help!
kcd

Hi,
I have a similar problem. Everything works in IE7 and FF, but
in IE6, my Spry Vertical menu appears in the wrong place on the
page. The outline of the menu is in the right place, but the actual
buttons are like a ghost in another place.

Similar Messages

  • Spry Menu Help Needed

    I have searched through the forum and did not find an answer
    to this question.
    I successfully created a horizontal menu using the spry
    widget for horizontal menu.
    The problem is that in IE, the menu throws the sub menus far
    to the right. It functions beautifully in firefox and Safari.
    PLEASE HELP!
    Thanks!
    Attached is the .css file:

    The answer to this question is that the spry menu system for
    a horizontal menu does not work if you align the top link to the
    center. It worked fine when I set it back to the left.
    Too bad.

  • Having Problem with Spry Menu - Help appreciated

    Hello there
    I am currently developing my website but I am having terrible problems with the spry menu. I have tried lots of things but not yet resolved the issue. I will try to give as much info as possible. My website is www.huntfilms.ie
    When I am in dreamweaver the site looks fine and when I preview in browser also looks fine but when I have uploaded to server there is the problem as you can see.
    I uploaded all the files that are required I think . I have attached a screen grab of my server view below. : I have six spry files : js,css and four giff files : I have included the code below. I would apprecaite help as been at this for best part of day with no luck ; going mad here
    thanks
    Barry
    <script src="file:///Macintosh HD/Users/barryhunt/Desktop/huntfilms1/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="file:///Macintosh HD/Users/barryhunt/Desktop/huntfilms1/SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    </head>
    <body class="oneColElsCtrHdr">
    <div id="container">
      <div id="header">
        <h1>Hunt Films</h1>
      <!-- end #header --></div>
      <ul id="MenuBar1" class="MenuBarHorizontal">
        <li><a href="file:///Macintosh HD/Users/barryhunt/Desktop/huntfilms1/home.html">home</a>    </li>
        <li><a href="file:///Macintosh HD/Users/barryhunt/Desktop/huntfilms1/sample.html">Sample work</a></li>
        <li><a href="file:///Macintosh HD/Users/barryhunt/Desktop/huntfilms1/Contact.html">Contact Us</a>    </li>
    </ul>
    <div id="mainContent">
        <p><iframe src="http://player.vimeo.com/video/17962693?title=0&byline=0&portrait=0" width="400" height="320" frameborder="0" webkitAllowFullScreen allowFullScreen></iframe> </p>
        <p> </p>
        <p>Welcome! </p>
        <p>Hunt Films was set up in January 2011 by documentary maker Barry Hunt.</p>
        <p>Barry received training in TV and Video Production with FÁS in Tralee, Co Kerry. During this training Barry produced a series of short films about local artists. In 2006 he worked as assistant editor on the successful RTÉ drama series, ‘Love is the Dfile:///Users/barryhunt/Desktop/Picture%201.pngrug’.</p>
        <p>Since 2010 Barry has embarked on solo projects producing two entertaining half hour documentaries. 'Liberation', explores the world of pigeon racing in Dublin. This film was very well received at the Galway Film Festival 2011. More recently Barry produced 'The Gregory Seat', a documentary which follows Maureen O'Sullivan’s campaign to be elected in the 2011 General Election.</p>
        <p>Barry looks forward to producing more documentaries. He is interested in human stories and hopes that this will form the basis of his future work. At present, Barry is developing projects for film festivals and general broadcast    </p>
        <p> </p>
      <!-- end #mainContent --></div>
      <div id="footer">
        <p>Footer</p>
      <!-- end #footer --></div>
    <!-- end #container --></div>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>
    server view  of files uploaded file:///Users/barryhunt/Desktop/Picture%201.png

    here is the code still not working can anyone tell me why
    <!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">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
    body {
              font: 100% Verdana, Arial, Helvetica, sans-serif;
              background: #666666;
              margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
              padding: 0;
              text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
              color: #000000;
    /* Tips for Elastic layouts
    1. Since the elastic layouts overall sizing is based on the user's default fonts size, they are more unpredictable. Used correctly, they are also more accessible for those that need larger fonts size since the line length remains proportionate.
    2. Sizing of divs in this layout are based on the 100% font size in the body element. If you decrease the text size overall by using a font-size: 80% on the body element or the #container, remember that the entire layout will downsize proportionately. You may want to increase the widths of the various divs to compensate for this.
    3. If font sizing is changed in differing amounts on each div instead of on the overall design (ie: #sidebar1 is given a 70% font size and #mainContent is given an 85% font size), this will proportionately change each of the divs overall size. You may want to adjust based on your final font sizing.
    .oneColElsCtrHdr #container {
              width: 46em;  /* this width will create a container that will fit in an 800px browser window if text is left at browser default font sizes */
              background: #FFFFFF;
              margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
              border: 1px solid #000000;
              text-align: left; /* this overrides the text-align: center on the body element. */
    .oneColElsCtrHdr #header {
              background: #DDDDDD;
              padding: 0 10px 0 20px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
    .oneColElsCtrHdr #header h1 {
              margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
              padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
    .oneColElsCtrHdr #mainContent {
              padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
              background: #FFFFFF;
    .oneColElsCtrHdr #footer {
              padding: 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
              background:#DDDDDD;
    .oneColElsCtrHdr #footer p {
              margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
              padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
    -->
    </style>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    </head>
    <body class="oneColElsCtrHdr">
    <div id="container">
      <div id="header">
        <h1>Header</h1>
      <!-- end #header --></div>
      <div id="mainContent">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a class="MenuBarItemSubmenu" href="#">Item 1</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="#">Item 2</a></li>
          <li><a class="MenuBarItemSubmenu" href="#">Item 3</a>
            <ul>
              <li><a class="MenuBarItemSubmenu" href="#">Item 3.1</a>
                <ul>
                  <li><a href="#">Item 3.1.1</a></li>
                  <li><a href="#">Item 3.1.2</a></li>
                </ul>
              </li>
              <li><a href="#">Item 3.2</a></li>
              <li><a href="#">Item 3.3</a></li>
            </ul>
          </li>
          <li><a href="#">Item 4</a></li>
        </ul>
        <h1> </h1>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
        <h2>H2 level heading </h2>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>
      <!-- end #mainContent --></div>
      <div id="footer">
        <p>Footer</p>
      <!-- end #footer --></div>
    <!-- end #container --></div>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>

  • Spry menu Help Me

    I need help!!! I cannot for the life of me figure out how to
    include a spry menu bar that I made into all the pages in my
    website. I believe that I would have to use some sort of include
    statement but that's about all I know. So can someone please help
    me...

    Umm I don't quite understand what problem you have.
    A menu is marked up in an Unordered List -
    <ul></ul>
    and List Items - <li></li> for the... Items
    For sub menu you put another unordered list into a List Item
    You then need to apply the classes and ids then reference
    them in the javscript
    Everything you need is in the documentation here:
    http://labs.adobe.com/technologies/spry/articles/menu_bar/index.html

  • Spry menu help 2

    i have the correct links typed in on my spry menu bar but two
    arent working (our pastors and events)and my sub menus wont even
    act as links. also on some pages the menu bar goes under the text?
    any help woul be great! thanks
    http://www.pnlfamily.org is the
    site i am working on

    Hello,
    There are multiple problems that should be solved in your
    page. The most important one is the fact your page is not having on
    top of the page the necessary comment that identifies the HTML
    version to be used. This will cause the browsers to interpret your
    page in
    Quirks
    Mode, instead of Strict Mode. The Quirks Mode is not supported
    by us because of the numerous problems that exists on different
    browsers in behaviors. Please add the correct DOCTYPE to your page
    which will put the page in the Standard Mode and all the browsers
    will render the page (or at least they try) in compliance with the
    current standards on the web.
    The code in page is not compliant with any HTML standards
    containing multiple <body> and <html> inside which will
    make the browsers to behave completely weird. You should use the
    W3C validator and correct all
    the problems the validator reports. In case you use any Spry
    special tags in your page you'll have to read the
    Spry
    W3C validation documentation.
    You have in IE7 a JavaScript error in page because you use a
    function "qm_create" that is defined in a file which is not loading
    because of the difference in interpreting the multiple <html>
    tags in your document. Actually your problem appear in IE only and
    not in FF, where this JS error doesn't exists as well, and this
    could be one of the reasons.
    You used extensively in your CSS layout absolute positioning
    and z-indexing which is not a good practice and most certainly will
    trigger some specific bugs in IE where the elements will start
    overlapping even if the z-indexes are correctly set. My advice is
    to modify the way you designed your CSS and to use the normal page
    flow to arrange the elements in page to not need z-indexing and
    positioning anymore.
    Regards,
    Cristian

  • Spry Menu help

    Hello, I've been working on a phpbb3 layout and have placed a
    horizontal spry menu into the overall_header.html.
    Apart from the arrows not showing up it works perfectly on
    www.breeze-studios.com, which is where I've been testing the
    layout.
    However when we transferred the layout to
    www.inspired-quills.com/phpbb3/ the menu stopped working as the
    drop down part, wont drop down. The folder set up betweent the two
    sites is the same, so I'm really at a loss as to why it wont work.
    Any ideas?
    I've attached a copy of the overall_header.html

    Hello,
    This is a known issue we have on IE caused by a fix trying to
    overcome another IE bug. To solve this problem you'll have to
    search in your menu CSS file for the following contextual selector
    (almost on the bottom of the page):
    ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
    and add inside the following line:
    filter:alpha(opacity:0.1);
    The final code will look something like this:
    ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
    filter:alpha(opacity:0.1);
    This fix is included in the latest versions of Spry which
    will be soon released.
    Regards
    Cristian MARIN

  • Using external xml for spry menu help

    Just started playing with DW CS3, I would like to know how to
    insert a spry menu and get the xml data from an external file. Can
    anyone point me at a suitable example or tutorial please?

    The video workshop has some great tutorials with spry.
    http://www.adobe.com/designcenter/video_workshop/
    Aram

  • DreamWeaver Spry Menu Help

    OK! So im pretty good with Adobe DreamWeaver and have no problem  creating or editing a Spry Menu. My issue is how to Edit a Spry Menu so  that i can add or remove topics across multiple pages, without having to  individualy edit each page.
    I am looking to have a website of over 500 Pages and i want one Spry  Menu bar that can be edited once, but changes the drop down options for  all 500+ pages that. I will frequently want to update the Spry Menu.
    If anyone here has any idea how i do that, please let me know, i have been searching google all day, with no luck.
    Thanks

    You would use a SSI file (Server Side Include)
    The idea is that you create one file (containing all the spry menu coding) and then via the server side include the spry menu coding is inserted into all of the pages that you apply it to.
    When you come to update the menu you just change the one file and upload that to your server instead of 500 pages.
    Google 'server side include'

  • Drop down spry menu help... please

    I've been working on a website for the company I work for which helps abused, neglected, and abandoned kids. I am having a unique error on each one of my pages. I conduct a compatibility check with my pages and the same thing keeps popping up.... "Found 1 error in SpryMenuBarHorizontal.css" everything works fine in the newer safari and firefox browsers but if I open up IE or earlier versions of other browsers the error is a cluster. Could anyone please help me figure this thing out? I haven't really begun to style my menu because their is no use until I can get this thing nailed down. The link to my testing server is http://fiyahstudios.com/~sheriffs/       Any suggestions are welcome! please keep in mind that this is my first attempt on a website so it's not over-the-top by any means.
    Thanks
    Jimmy

    I did some research and found that the ul.MenuBarHorizontal li.MenuBarItemIE was indeed the problem. Or in fact the background: #FFF reverted my menu bar to a white mass at the top of the page. I think I did get a bit over-zealous and deleted the whole folder. But it works with everything except with all browsers IE6 which is only 2% of the user population. But if anyone is having trouble with spry user-ability a helpful resource is: http://library.creativecow.net/articles/williams_richard/spry_menu_explained.php

  • SOS. SPRY MENU HELP

    i would like to change the background of my spry horizontal
    menu to an image saved on my computer.. the image is also the
    layout of my website and i would like it to match. is it possible
    for me do so this? SOS. hELP.. getting slightly fustrated.

    quote:
    Originally posted by:
    V1 Fusion
    ul.MenuBarHorizontal ul {SpryMenuBarHorizo... (line 84)
    border:1px solid #CCCCCC;
    width:auto;
    add width:auto;
    ul.MenuBarHorizontal ul {SpryMenuBarHorizo... (line 42)
    change the position to position:static;
    This just made the submienus visible all of the
    time...

  • Spry Menu Help in IE

    Hello to all,
    So i'm creating this page and i added the spry horizontal
    menu bar and i added ,
    ul.MenuBarHorizontal {
    width: 32.2em;
    margin: auto;
    And the menu bar centers perfectly in Firefox but still
    doesnt center when i preview it in IE.. any suggestions ??
    thanks

    Hi,
    Please give us the url where to see your page.
    If you didn't add any other additional tags to menu bar, the
    menu bar should be centered also in IE as it is for this
    sample.
    Thanks,
    Diana

  • Spry menu bar changed since I tried to split cells in a table! Help!

    I am VERY new to web design, so I apologize in advance for being ignorant.  I am trying to learn!
    I had inserted a spry menu bar that looked fine and even tested fine!
    I subsequently tried to split a section of my table in the web page in order to have 3 columns of centered text.  The first time I did this, the spry menu bar became vertical even though it is listed as horizontal.  I looked up a forum answer, copied the code from the suggestion, and that seemed to fix the problem (although I still don't know what EXACTLY happened)
    I tried to split the table again (I had undone everything prior to this), only this time, the spry menu bar is located outside the page in the left hand corner where my background (I have a wrapper) is.  I tried opening another page where I already had a nice spry menu bar, and it did the same thing!! This makes me think it is the CSS sheet for the menu bar that was modified somehow when I split the table.  I'm pasting the CSS here below, so if anyone sees any issues that might cause this problem, please let me know!! I have been working for the most part in design view, and haven't really modified the code other than to put a wrapper in and a facebook like button, which I've now lost in the slitting cells catastrophe.  Thanks in advance!!!
    @charset "UTF-8";
    /* SpryMenuBarHorizontal.css - Revision: Spry Preview Release 1.4 */
    /* 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-top: 0;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
    padding: 0;
    list-style-type: none;
    font-size: 12pt;
    cursor: default;
    width: 60%;
    float: left;
    /* 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: 12pt;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: auto;
    float: left;
    background-color: #99CC66;
    /* 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: 1020;
    cursor: default;
    width: auto;
    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: auto;
    /* 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: auto;
    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;
    background-color: #99CC66;
    padding: 0.5em 0.75em;
    color: #333;
    text-decoration: none;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    background-color: #336600;
    color: #FFF;
    /* 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
    background-color: #33C;
    color: #FFF;
    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%;
    /* 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;
    /* 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;

    Well, I took a picture of my dreamweaver screen, so you can see what I am looking at...
    You can see that the spry menu bar shows up in the top left corner in my design view, but on the website, it is located in the correct place! Maybe it is a Dreamweaver problem??? This happened when I tried to split the cell underneath the section that says "Let NOLA Scribes help you!" into 5 cells so that I could insert 5 differnet pictures and captions. Now, when I open the other linked pages in Dreamweaver, it does the same thing! I'm using an older version of Dreamweaver, but from what I read, that shouldn't be an issue.  Thanks in advance for your help!

  • Spry Menu Bar - Help Request

    Hello!
    I'm using a horizontal spry menu bar with horizontal sub menu
    and have almost gotten the navigation exactly how I need it. I'm
    stuck, however, and don't know how to fix the following:
    1. I have absolute positioning set for my sub menu so that
    the items appear under the left-most main menu item instead of
    their parent item. When I change screen sizes, the sub menu stays
    put (as it should) and everything else moves with the re-size. I
    can't figure out where the sub menu positioning is originally set
    to change it or how to get it to appear where it currently is
    without using absolute positioning.
    2. I would like to center the contents of the sub menu and I
    think I've tried text-align:center everywhere possible but to no
    avail. Any suggestions would be greatly appreciated!
    3. Is there any way that the menu can recongnize the page
    that it's on and display the appropriate link high-lighted. For
    example, when you open the home page the active/focus state for the
    "Home" button shows (for this menu it would be a different color
    background image) and it's corresponding sub menu would be
    displayed automatically. Would a script do it? Is there anything
    like this available?
    The following is the page code and accompanying css. I have
    not altered the js file. I apologize for not being able to provide
    a link, but may be able to do so this evening.
    Thanks in advance for your help!
    Stephi
    <!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">
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=utf-8" />
    <title>ContraCostaTest</title>
    <script src="SpryAssets/SpryMenuBar.js"
    type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css"
    rel="stylesheet" type="text/css" />
    <link href="Style/style.css" rel="stylesheet"
    type="text/css" />
    <style>
    #container{width:800px; margin:0 auto 0 auto;}
    #content{width:714px; background-color:white;margin:22px 0 0
    0;color:#CCCCCC; font-size:10px}
    #navbar{padding:0 0 32px 0; *margin:0 0 -32px 0; }
    </style>
    </head>
    <body>
    <div id="container">
    <div id="navbar">
    <ul id="MainMenu" class="MenuBarHorizontal">
    <li><a class="MenuBarItemSubmenu"
    href="#">Home<br /> </a>
    <ul>
    <li><a href="#">About Us <span> |
    </span></a></li>
    <li><a href="#"> Contact Us <span> |
    </span></a></li>
    <li><a href="#"> ATM Locator <span> |
    </span></a></li>
    <li><a href="#"> News <span> |
    </span></a></li>
    <li><a href="#"> Links <span> |
    </span></a></li>
    <li><a href="#"> Join <span> |
    </span></a></li>
    <li><a href="#"> Employment</a></li>
    </ul>
    </li>
    <li><a href="#" class="MenuBarItemSubmenu">Loans
    &amp;Rates</a>
    <ul>
    <li><a href="#">Consumer Loans <span> |
    </span></a></li>
    <li><a href="#"> VISA <span> |
    </span></a></li>
    <li><a href="#"> Mortgage Loans <span> |
    </span></a></li>
    <li><a href="#"> Auto Buying
    Center</a></li>
    </ul>
    </li>
    <li><a class="MenuBarItemSubmenu"
    href="#">Checking &amp; Savings</a>
    <ul>
    <li><a href="#">Regular Savings <span> |
    </span></a> </li>
    <li><a href="#"> Checking <span> |
    </span></a></li>
    <li><a href="#"> IRA <span> |
    </span></a></li>
    <li><a href="#"> Share Certificates <span>
    | </span></a></li>
    <li><a href="#"> Club Accounts <span> |
    </span></a></li>
    <li><a href="#"> Rates</a></li>
    </ul>
    </li>
    <li><a href="#"
    class="MenuBarItemSubmenu">Electronic Services</a>
    <ul>
    <li><a href="#">@ccessOnline <span> |
    </span></a></li>
    <li><a href="#"> BillPay <span> |
    </span></a></li>
    <li><a href="#"> Direct Deposit &amp;
    Payroll Deduction <span> | </span></a></li>
    <li><a href="#"> Automatic Bill Payments
    <span> | </span></a></li>
    <li><a href="#"> ATM or MasterMoney <span>
    | </span></a></li>
    <li><a href="#"> Access
    Line</a></li>
    </ul>
    </li>
    <li><a href="#"
    class="MenuBarItemSubmenu">Locations<br />
     </a>
    <ul>
    <li><a href="#"> </a></li>
    </ul>
    </li>
    <li><a href="#" class="MenuBarItemSubmenu">Forms
    &amp; Applications</a>
    <ul>
    <li><a href="#"> </a></li>
    </ul>
    </li>
    <li><a href="#" class="MenuBarItemSubmenu">Auto
    Buying Center</a>
    <ul>
    <li><a href="#"> </a></li>
    </ul>
    </li>
    </ul>
    </div>
    <div id="content">This is a test. This is a test. This
    is a test. This is a test. This is a test. This is a test. This is
    a test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test.
    </div>
    </div>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MainMenu",
    {imgDown:"SpryAssets/SpryMenuBarDownHover.gif",
    imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>
    @charset "UTF-8";
    ul.MenuBarHorizontal
    margin: 0 auto 0 auto;
    padding: 0; /*NOTE: removing this item causes menu bar to
    shift right in FF. wierd...*/
    list-style-type: none;
    font-size: .7em;
    cursor: default;
    ul.MenuBarActive
    z-index: 1000;
    ul.MenuBarHorizontal li
    list-style-type: none;
    font-size: 100%;
    text-align: center;
    cursor: pointer;
    width: 9.1em;
    float: left;
    ul.MenuBarHorizontal ul
    margin: 0 auto 0 auto;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    position: absolute;
    left: 112px;
    *left: 101px;
    border:#CC0033 1px solid;
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    left: 112px;
    *left: 101px;
    z-index: 1030;
    /*NOTE: submenu set at higher z-index than for
    ul.MenuBarHorizontal ul above at 1020 to display*/
    ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    background-image:url(../Images/BGup_03.gif);
    color: #333;
    text-decoration: none;
    height:30px;
    padding-top:2px;
    text-align:center;
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    color: #FFF;
    background-image:url(../Images/BGover_03.gif);
    ul.MenuBarHorizontal iframe{
    position: absolute;
    left: 112px;
    *left: 101px;
    ul.MenuBarHorizontal ul{
    background-color:#999999;
    width:714px; /*NOTE:setting a width keeps submenu
    horizontal*/
    ul.MenuBarHorizontal li li{
    width:auto;
    ul.MenuBarHorizontal li li a{
    background-color:#999999;
    height:20px;
    background-image:none;
    margin-left:5px;
    ul.MenuBarHorizontal li li a span{
    color:black;
    ul.MenuBarHorizontal li li a:hover, ul.MenuBarHorizontal li
    ul li a:focus{
    color:white;
    height:20px;
    background-image:none;
    Text

    Hello!
    I'm using a horizontal spry menu bar with horizontal sub menu
    and have almost gotten the navigation exactly how I need it. I'm
    stuck, however, and don't know how to fix the following:
    1. I have absolute positioning set for my sub menu so that
    the items appear under the left-most main menu item instead of
    their parent item. When I change screen sizes, the sub menu stays
    put (as it should) and everything else moves with the re-size. I
    can't figure out where the sub menu positioning is originally set
    to change it or how to get it to appear where it currently is
    without using absolute positioning.
    2. I would like to center the contents of the sub menu and I
    think I've tried text-align:center everywhere possible but to no
    avail. Any suggestions would be greatly appreciated!
    3. Is there any way that the menu can recongnize the page
    that it's on and display the appropriate link high-lighted. For
    example, when you open the home page the active/focus state for the
    "Home" button shows (for this menu it would be a different color
    background image) and it's corresponding sub menu would be
    displayed automatically. Would a script do it? Is there anything
    like this available?
    The following is the page code and accompanying css. I have
    not altered the js file. I apologize for not being able to provide
    a link, but may be able to do so this evening.
    Thanks in advance for your help!
    Stephi
    <!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">
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=utf-8" />
    <title>ContraCostaTest</title>
    <script src="SpryAssets/SpryMenuBar.js"
    type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css"
    rel="stylesheet" type="text/css" />
    <link href="Style/style.css" rel="stylesheet"
    type="text/css" />
    <style>
    #container{width:800px; margin:0 auto 0 auto;}
    #content{width:714px; background-color:white;margin:22px 0 0
    0;color:#CCCCCC; font-size:10px}
    #navbar{padding:0 0 32px 0; *margin:0 0 -32px 0; }
    </style>
    </head>
    <body>
    <div id="container">
    <div id="navbar">
    <ul id="MainMenu" class="MenuBarHorizontal">
    <li><a class="MenuBarItemSubmenu"
    href="#">Home<br /> </a>
    <ul>
    <li><a href="#">About Us <span> |
    </span></a></li>
    <li><a href="#"> Contact Us <span> |
    </span></a></li>
    <li><a href="#"> ATM Locator <span> |
    </span></a></li>
    <li><a href="#"> News <span> |
    </span></a></li>
    <li><a href="#"> Links <span> |
    </span></a></li>
    <li><a href="#"> Join <span> |
    </span></a></li>
    <li><a href="#"> Employment</a></li>
    </ul>
    </li>
    <li><a href="#" class="MenuBarItemSubmenu">Loans
    &amp;Rates</a>
    <ul>
    <li><a href="#">Consumer Loans <span> |
    </span></a></li>
    <li><a href="#"> VISA <span> |
    </span></a></li>
    <li><a href="#"> Mortgage Loans <span> |
    </span></a></li>
    <li><a href="#"> Auto Buying
    Center</a></li>
    </ul>
    </li>
    <li><a class="MenuBarItemSubmenu"
    href="#">Checking &amp; Savings</a>
    <ul>
    <li><a href="#">Regular Savings <span> |
    </span></a> </li>
    <li><a href="#"> Checking <span> |
    </span></a></li>
    <li><a href="#"> IRA <span> |
    </span></a></li>
    <li><a href="#"> Share Certificates <span>
    | </span></a></li>
    <li><a href="#"> Club Accounts <span> |
    </span></a></li>
    <li><a href="#"> Rates</a></li>
    </ul>
    </li>
    <li><a href="#"
    class="MenuBarItemSubmenu">Electronic Services</a>
    <ul>
    <li><a href="#">@ccessOnline <span> |
    </span></a></li>
    <li><a href="#"> BillPay <span> |
    </span></a></li>
    <li><a href="#"> Direct Deposit &amp;
    Payroll Deduction <span> | </span></a></li>
    <li><a href="#"> Automatic Bill Payments
    <span> | </span></a></li>
    <li><a href="#"> ATM or MasterMoney <span>
    | </span></a></li>
    <li><a href="#"> Access
    Line</a></li>
    </ul>
    </li>
    <li><a href="#"
    class="MenuBarItemSubmenu">Locations<br />
     </a>
    <ul>
    <li><a href="#"> </a></li>
    </ul>
    </li>
    <li><a href="#" class="MenuBarItemSubmenu">Forms
    &amp; Applications</a>
    <ul>
    <li><a href="#"> </a></li>
    </ul>
    </li>
    <li><a href="#" class="MenuBarItemSubmenu">Auto
    Buying Center</a>
    <ul>
    <li><a href="#"> </a></li>
    </ul>
    </li>
    </ul>
    </div>
    <div id="content">This is a test. This is a test. This
    is a test. This is a test. This is a test. This is a test. This is
    a test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test. This is a test. This is a test. This is a
    test. This is a test.
    </div>
    </div>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MainMenu",
    {imgDown:"SpryAssets/SpryMenuBarDownHover.gif",
    imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>
    @charset "UTF-8";
    ul.MenuBarHorizontal
    margin: 0 auto 0 auto;
    padding: 0; /*NOTE: removing this item causes menu bar to
    shift right in FF. wierd...*/
    list-style-type: none;
    font-size: .7em;
    cursor: default;
    ul.MenuBarActive
    z-index: 1000;
    ul.MenuBarHorizontal li
    list-style-type: none;
    font-size: 100%;
    text-align: center;
    cursor: pointer;
    width: 9.1em;
    float: left;
    ul.MenuBarHorizontal ul
    margin: 0 auto 0 auto;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    position: absolute;
    left: 112px;
    *left: 101px;
    border:#CC0033 1px solid;
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    left: 112px;
    *left: 101px;
    z-index: 1030;
    /*NOTE: submenu set at higher z-index than for
    ul.MenuBarHorizontal ul above at 1020 to display*/
    ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    background-image:url(../Images/BGup_03.gif);
    color: #333;
    text-decoration: none;
    height:30px;
    padding-top:2px;
    text-align:center;
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    color: #FFF;
    background-image:url(../Images/BGover_03.gif);
    ul.MenuBarHorizontal iframe{
    position: absolute;
    left: 112px;
    *left: 101px;
    ul.MenuBarHorizontal ul{
    background-color:#999999;
    width:714px; /*NOTE:setting a width keeps submenu
    horizontal*/
    ul.MenuBarHorizontal li li{
    width:auto;
    ul.MenuBarHorizontal li li a{
    background-color:#999999;
    height:20px;
    background-image:none;
    margin-left:5px;
    ul.MenuBarHorizontal li li a span{
    color:black;
    ul.MenuBarHorizontal li li a:hover, ul.MenuBarHorizontal li
    ul li a:focus{
    color:white;
    height:20px;
    background-image:none;
    Text

  • Added a spry menu bar and site works in firefox but not in chrome or IE.  Please help

    Hello,
    I'm a photographer by trade and have only picked up enough web design knowledge  in order to build a website that isn't distracting to my photographs and is simple to update and mantain.  Please breakdown any answers to my questions in very simple terms.
    To start off here is a link to my site for reference.  www.cechternach.com
    1.  My Biggest problem right now is that my site works in firefox but appears as a blank white page in chrome and in IE it only shows my background color.
         I'm assuming that this has something to do with the spry menu bar I added.  The galleries, banner, and footer were all part of a previous version of this website that didn't use the menu bar.  I actually used png's exported from an illustrator as buttons.  I've been wrestling with this menu bar for a few days now.  I had an issue with the menubar forcing down the gallery below it.  that was fixed by changing a position value from relative  to absolute in the menubar css.  Then I couldn't see the submenu over the galleries.  I think I fixed that with a wmode change but I"m not sure if I did that right.  I believe i needed to change that in the object and embed part of the code.  One spot for certain browsers and the other spot for other browsers.  I was a little confused on this because i also read that i needed to change the wmode in the javascript file in dreamweaver cs4 which is what i'm using.  Whatever wmode I changed it seemed to work in firefox.  The submenu background was showing up transparent but i fixed that in the menubar css.
    2.  I would like the submenu's to have a semi transparent blurred background effect.  Is this possible with a spry menu bar?
    3.  How do I center my text in the submenu?
    4.  My menu bar buttons should be the same font as my name in my banner.  It looks fine on my computer that has that font loaded but on other computers I was testing the site on the menubar buttons show up as a default font.  How can i fix this?
    5.  Is there any way to get rid of the grey lines that show up around my slideshow pro galleries and menu bar buttons when they are clicked?
    The last four questions aren't as important as the first one.  I may be upsetting the flow of the forum as well.  Please let me know if I'm not following procedure with any of my questions.  Feel free to point out any other problems you see with my page.  I'm trying to learn this as I go.  Thanks in advance.

    Spry widgets, which includes the SpryMenuBar, in their original state do not pose any problem in any browser!
    Widgets contain two parts
    JavaScript which drives the widget
    CSS which styles the widget to individual tastes
    The most common reason for a widget to misbehave especially in IE is because the inexperienced web developer has upset the delicate balance of the CSS. I say delicate, because in the original, great care has been taken by the Spry team to ensure cross browser compatibility.
    There are other reasons why a whole page can misbehave. In these cases, the culprit should be sought outside of the Spry framework.
    When trouble shooting, I would first of all comment out all of the Spry Spry parts and test the page in IE. If it does work after that, then yes come back here and we will have a look at the SpryMenuBarHorizontal.css for you.
    If it doesn't work after disabling Spry, then have a look at the coding and the CSS for your page and fix that.
    I hope this helps.
    Ben

  • Need help with Spry Menu Bar

    Hello,  I have two templates that I am using.  Both have a horizontal menu bar across the top of the page and then two Vertical Spry Menu Bars down the left hand side of the page - one above the other.  On one template, all menu bars are working correctly.  On the other template, 2 out of three are working correctly.  Not sure what's happening here.  The spry menu bar that is not working correctly is under "Books & Materials" heading.  The menu bar is supposed to turn green when you mouse over it, but instead everything turns white and looks like it "disappears".  I have no idea why it would work on one template and not the other.  Or for that matter, why it is working on one vertical spry menu bar, but not the other on the same page.  Can anyone help me?   www.springerlejoy.com/proanimals4.html  This is a page that shows where it is not working.  Basically, all of the products pages are having this problem.  If you go to the home page:  www.springerlejoy.com you will see that this page is working - using a different template.  Can anyone help me?  I'm at a loss!  Thanks!
    Debbie
    Here is the code for the template that is NOT working:
    <!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">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>Untitled Document</title>
    <!-- TemplateEndEditable -->
    <link href="../thrColFixHdr.css" rel="stylesheet" type="text/css" /><!--[if IE 5]>
    <style type="text/css">
    /* place css box model fixes for IE 5* in this conditional comment */
    .thrColFixHdr #sidebar1 { width: 180px; }
    .thrColFixHdr #sidebar2 { width: 190px; }
    </style>
    <![endif]--><!--[if IE]>
    <style type="text/css">
    /* place css fixes for all versions of IE in this conditional comment */
    .thrColFixHdr #sidebar2, .thrColFixHdr #sidebar1 { padding-top: 30px; }
    .thrColFixHdr #mainContent { zoom: 1; }
    /* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
    </style>
    <![endif]-->
    <!--[if IE]>
    <style type="text/css">
    .thrColFixHdr #container { zoom: 1; }
    </style>
    <![endif]-->
    <style type="text/css">
    <!--
    <script type="text/javascript">
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    document.write(unescape("%3Cscript
    </script>
    <script type="text/javascript">
    try {
    var pageTracker = _gat._getTracker("UA-11559638-1");
    pageTracker._trackPageview();
    } catch(err) {}</script>
    body {
    background-color: #CCEA86;
    .maincontenthdr {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 24px;
    font-style: italic;
    font-weight: bold;
    color: #530000;
    text-align: center;
    height: 29px;
    .maincontenthdr1 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: bold;
    color: #600;
    .maincontenttxt {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: normal;
    color: #000;
    /*Credits: Dynamic Drive CSS Library */
    /*URL: http://www.dynamicdrive.com/style/ */
    .thumbnail{
    position: relative;
    z-index: 0;
    .thumbnail:hover{
    background-color: transparent;
    z-index: 50;
    .thumbnail span{ /*CSS for enlarged image*/
    position: absolute;
    background-color: lightyellow;
    padding: 5px;
    left: -800px;
    border: 1px dashed gray;
    visibility: hidden;
    color: black;
    text-decoration: none;
    .thumbnail span img{ /*CSS for enlarged image*/
    border-width: 0;
    padding: 2px;
    .thumbnail:hover span{ /*CSS for enlarged image on hover*/
    visibility: visible;
    top: 0;
    left: 60px; /*position where enlarged image should offset horizontally */
    -->
    </style>
    <script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <script type="text/javascript">
    <!--
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    //-->
    </script>
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    <link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    <!--
    body {
    background-color: #CCEA86;
    -->
    </style>
    <link href="../SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
    </head>
    <body class="thrColFixHdr" onload="MM_preloadImages('../history2.gif')">
    <div id="container">
      <div id="header">
    <table width="810" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td><div class="hdrtxt">
          <p>2104 Clairmont Drive<br />
            Pittsburgh, PA 15241<br />
            T 412-616-9066<br />
            F 412-220-2074 </p>
          </div></td>
        <td align="center"><a href="../index.html"><img src="../logo3.jpg" width="313" height="149" border="0" /></a></td>
        <td><div class="rthdrtxt">Cookie Molds from <br />
          the Old World for <br />
          Baking and Crafts</div>
           </td>
      </tr>
      <tr>
        <td width="189" background="../lines.gif"></td>
        <td width="409" align="center" background="../lines.gif"> </td>
        <td width="182" background="../lines.gif"></td>
        </tr>
      <tr bgcolor="#BB7C4E">
        <td colspan="3" align="left"><ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a href="../index.html">Home</a></li>
    <li><a href="../aboutus4.html">About Us</a></li>
    <li><a href="../howtoorder4.html">How To Order</a>          </li>
          <li><a href="../information4.html">Information</a></li>
          <li><a href="../contactus4.html">Contact Us</a></li>
          <li><a href="../recipeshome.html">Recipes</a></li>
          <li><a href="../events4.htm">Events</a></li>
          <li><a href="../gallery4.html">Photo Gallery</a></li>
        </ul></td>
        </tr>
    </table>
    <div class="divmenubar"> </div>
    </div>
      <div id="sidebar1">
        <div class="FeatureItem">
    <div align="center"><span class="FeatureItemHead"> </span>
      <div>
        <div class="Products">Products
          <br />
          <br />
        </div>
    <div class="proHeaders">Molds</div>
      </div>
    </div>
    <ul id="MenuBar2" class="MenuBarVertical">
      <li><a href="../proangels4.html">Angels</a>      </li>
        <li><a href="../proanimals4.html">Animals</a></li>
        <li><a href="../probaby4.html">Baby</a>      </li>
        <li><a href="../probiblical4.html">Biblical</a></li>
        <li><a href="../probirds41.html">Birds</a></li>
    <li><a href="../prochildren4.html">Children</a></li>
        <li><a href="../prochristgen4.html">Christmas, General</a></li>
        <li><a href="../prochristrel41.html">Christmas, Religious</a></li>
        <li><a href="../procornucopia4.html">Cornucopia</a></li>
        <li><a href="../procultfig4.html">Cultural Figures</a></li>
        <li><a href="../profishing4.html">Fish</a></li>
        <li><a href="../proflowers4.html">Flowers &amp; Plants</a></li>
        <li><a href="../profruits4.html">Fruit</a></li>
        <li><a href="../progeometric4.html">Geometric</a></li>
        <li><a href="../progermany4.html">Germany</a></li>
        <li><a href="../prohearts4.html">Hearts</a></li>
        <li><a href="../proinsects4.html">Insects</a></li>
        <li><a href="../proluck4.html">Luck</a></li>
        <li><a href="../promarriage4.html">Marriage</a></li>
        <li><a href="../promultiple4.html">Multiple Images</a></li>
        <li><a href="../promusic4.html">Music</a></li>
        <li><a href="../pronautical4.html">Nautical</a></li>
        <li><a href="../proscenes4.html">Old Time Scenes</a></li>
        <li><a href="../propeople4.html">People in Old Times</a></li>
        <li><a href="../prosayings4.html">Sayings</a></li>
        <li><a href="../proschool4.html">School</a></li>
        <li><a href="../proseasons4.html">Seasons</a></li>
        <li><a href="../prostar4.html">Star</a></li>
        <li><a href="../prostory4.html">Story / Legend Characters</a></li>
        <li><a href="../prosunmoon4.html">Sun &amp; Moon</a></li>
        <li><a href="../proswitzerland4.html">Switzerland</a></li>
        <li><a href="../prosymbols4.html">Symbols</a></li>
        <li><a href="../protransportation4.html">Transportation</a></li>
        <li><a href="../prozodiac4.html">Zodiac</a>    </li>
    </ul>
    <div class="proHeaders"><br />
      Books &amp; Materials</div>
    <ul id="MenuBar3" class="MenuBarVertical">
      <li><a href="../probooks4.html">Books</a>    </li>
      <li><a href="../procookies4.html">Cookies</a></li>
      <li><a href="../procutters4.html">Cutters</a>    </li>
      <li><a href="../proflavoring4.html">Flavoring</a></li>
      <li><a href="../profoodcolor4.html">Food Coloring</a></li>
      <li><a href="../promaterials4.html">Materials</a></li>
      <li><a href="../protools4.html">Tools</a><br /></li>
    </ul>
    </div>
    </div>
      <div></div>
      <div id="sidebar2">
        <div class="nxtevents">
          <div class="MenuBarActive">
            <div><a href="http://order.store.yahoo.net/cgi-bin/wg-order?yhst-40727766898036 "><img src="../cart1.gif" name="imgfloatright" width="87" height="26" border="0" id="imgfloatright" /></a></div>
            <p><br />
              <br />
            </p>
          </div>
          <div class="nxtevents">
            <div class="maincontenttxt">
              <div class="moldscenter"><span class="maincontenthdr1">Featured Item<br />
                </span>
    <p class="thumbnail"><a class="thumbnail" href="#thumb"><span><img src="1142.jpg" /></span></a> <a class="thumbnail" href="#thumb"><a class="thumbnail" href="#thumb"><img src="1142-1.jpg" width="93px" height="100px" border="0" /></a></p>
                <br />
                <table width="130" cellpadding="0" cellspacing="0">
        <tr>
          <td width="61" align="right" class="maincontenttxt">1142</td>
          <td width="67" align="right" class="maincontenttxt"><div align="right">$31.00</div></td>
        </tr>
      </table>
                <br />
                <a href="../proanimals4.html">The Three Rabbits springerle mold, dia. 3.5&quot; (90mm)</a><br />
                <br />
                <form method="post" action="<!--#ystore_order id=1142 -->">
              <p align="left" class="buttoncenter">
                <input type="submit" value="Order Now" />
              </p>
            </form><br />
              </div>
              <p class="nxteventshdr">News...        </p>
            </div>
            <p>2/8: Just Arrived from Switzerland today<br />
              <strong><U><br />
              <a href="../prohearts4.html">11 New Heart   Molds</a></U></strong><a href="../prohearts4.html"><U>!</U></a><U><br />
            </U></p>
          </div>
          <div id="moreevents">
            <p>2/7: See our new photos in the <a href="../gallery4.html">Photo Gallery</a>!</p>
          </div>
        </div>
        <div>
          <p class="nxteventshdr">Newsletter</p>
          <p class="nxtevents">To automatically receive our e-mail newsletter with new mold information, tips and tricks, photos of cookies and art, and historical profiles of featured molds, please fill in the form below and press &lt;Submit&gt;</p>
          <form method=post action="http://us.1.p6.webhosting.yahoo.com/forms?login=springerlejoy" id="form1" name="form1">
            <p class="maincontenttxt">First Name
      <input name="formFirstName" type="text" class="maincontenttxt" id="formFirstName" />
            </p>
            <p class="maincontenttxt">Last Name
              <input name="FormLast" type="text" class="maincontenttxt" id="FormLast" />
            </p>
            <p><span class="maincontenttxt">Email Address
                <input name="FormEmail" type="text" class="maincontenttxt" id="FormEmail" />
            </span></p>
            <div id="button">
              <input type="submit" name="SubmitButton" id="SubmitButton" value="Submit" />
            </div>
            <p> </p>
          </form>
          <p> </p>
          <p><a href="http://smallbusiness.yahoo.com/ecommerce/" target="_blank"><img src="http://us.i1.yimg.com/us.yimg.com/i/us/smallbiz/gr/ecomby_128bit.gif" alt="ecommerce provided by Yahoo! Small Business" width="118" height="55" border="0" align="middle"/></a> <br />
            <br />
          <a href="http://www.facebook.com/pages/Springerle-Joy/243604195833?ref=search&amp;sid=1000000928365 99.173275996..1&amp;v=wall#!/pages/Springerle-Joy/243604195833?v=wall&amp;ref=search"><img src="../5u84f48n.gif" width="144" height="44" /></a> </p>
        </div>
        <!-- end #sidebar2 -->
      </div>
      <div id="mainContent">
      <div class="maincontenthdr"> <!-- TemplateBeginEditable name="EditMainContHdr" -->   
        <p class="maincontenthdr">Products</p><div class="leafpic"><img src="../leaves3.jpg" width="420" height="32" /></div>
      <!-- TemplateEndEditable --></div>
    <div> 
      <div class="maincontenthdr1">
        <table width="418" border="0" cellspacing="0" cellpadding="0">
          <!-- TemplateBeginRepeat name="RepeatRegion1" -->
            <tr>
              <td width="87" rowspan="2" valign="top"><!-- TemplateBeginEditable name="EditRegion6" --> <!-- TemplateEndEditable --></td>
              <td width="255" valign="bottom" class="itemno"><!-- TemplateBeginEditable name="EditRegion7" --> <!-- TemplateEndEditable --></td>
              <td width="76" valign="bottom" class="price"><!-- TemplateBeginEditable name="EditRegion8" --> <!-- TemplateEndEditable --></td>
            </tr>
            <tr>
              <td valign="top" class="maincontenttxt"><!-- TemplateBeginEditable name="EditRegion10" --> <!-- TemplateEndEditable --></td>
              <td class="orderbutton"><!-- TemplateBeginEditable name="EditRegion11" --> <!-- TemplateEndEditable --></td>
            </tr>
            <!-- TemplateEndRepeat -->
          <tr>
            <td> </td>
            <td> </td>
            <td> </td>
          </tr>
        </table>
        <p> </p>
        <div class="maincontenttxt"></div>
        <p> </p>
    <div class="maincontenttxt"></div>
      </div>
    </div>
      </div>
    <p>
       <!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats -->
      </p>
    <p><br class="clearfloat" />
      </p>
      <div id="footer">
      <div id="copyrighttxt">
      <p>Copyright© by Springerle Joy, LLC 2010</p>
    </div>
    <!-- end #footer --></div>
    <!-- end #container --></div>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
    var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2", {imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>

    <script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    File cannot be found. Try
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    File cannot be found. Try
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <link href="file:///Macintosh HD/Users/julesmazur/Desktop/widgets/menubar/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    This link points to a local file on your local harddrive and can therefore not be found. However, this file is not needed because the file will be linked as above.
    Gramps

Maybe you are looking for