Printing Problems with Spry Menu. Help?

When I have a spry menu in the banner or main image and
go to print. Well the image of banner or main image will not print out. It comes out as blank space, with just menu and no background pic.
Help. Thanks

what setting do i change?
the thing is it printed before i added the spry menu.

Similar Messages

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>
</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>
</div>
<div id="footer">
    <p>Footer</p>
</div>
</div>
<script type="text/javascript">

</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">

</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>
</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>
</div>
<div id="footer">
    <p>Footer</p>
</div>
</div>
<script type="text/javascript">

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

Problem with Spry Menu Bar 2.0 (1.0) re - CSS

Hello:
I am having some difficulty with a Spry Menu Bar (horizontal) 2.0 (1.0) that I have created. Initially I thought the problem was with regard to rendering issues on IE 6.0, however the problem seems to be more general than that and I have come to believe that it has to do with the CSS created by the Widget Browser and modified once imported into the webpage. Hence I have elected to post my issue here rather than on the spry page.
I have relied on the tutorial provided by David Powers (Bayside.css) and in addition other documentation regarding the Spry menu bar UI. The problem appeared to be one of IE 6 rendering the page with a gap that is created when the drop down menus appear, thus pushing down any divs that appear below the page.
However, through a painstaking process of trial and error my problem now seems to be that when I export the CSS generated by the widget browser to an external style sheet (the general style sheet governing the whole site), it conflicts with other CSS styles regarding links etc. The end result is that all the padding, background colours, background images, and text colours are lost. So long as the CSS remains within the head this doesn't happen.
My thinking is that this must have to do with issues of specificity, inheritence, etc.
The site can be viewed at the following URL: http://www.aclco.org/testing/index.html. In its current form all CSS related to the menu bar is found in the head of each page. (see CSS below).
My question is can I establish a separate style sheet for the horizontal menu bar and have those styles applied specifically (and only) to the menu bar. My only other alternative is to work through the remainder of the general style sheet and work through any issues of specificity/inheritance -- which may be the "best" practice, but it risks causing other "cascading" [sic] problems elsewhere.
Any advice or suggestions or directed reading (that would point to a solution) that could be offered would be greatly appreciated.
Steve Webster
The CSS governing the horizontal menu bar is as follows: (currently the following CSS is embedded in the head of the web page)
<style type="text/css">
/* -- Begins Spry Menu Widget 2.0 (1.0) Horizontal menu bar Custom styles -- */
/* BeginOAWidget_Instance_2141544: #MenuBar */
/* Settable values for skinning a Basic menu via presets. If presets are not sufficient, most skinning should be done in
    these rules, with the exception of the images used for down or right pointing arrows, which are in the file SpryMenuBasic.css
     These assume the following widget classes for menu layout (set in a preset)
    .MenuBar - Applies to all menubars - default is horizontal bar, all submenus are vertical - 2nd level subs and beyond are pull-right.
    .MenuBarVertical - vertical main bar; all submenus are pull-right.
    You can also pass in extra classnames to set your desired top level menu bar layout. Normally, these are set by using a preset.
    They only apply to horizontal menu bars:
        MenuBarLeftShrink - The menu bar will be horizontally 'shrinkwrapped' to be just large enough to hold its items, and left aligned
        MenuBarRightShrink - Just like MenuBarLeftShrink, but right aligned
        MenuBarFixedLeft - Fixed at a specified width set in the rule '.MenuBarFixedLeft', and left aligned.
        MenuBarFixedCentered - - Fixed at a specified width set in the rule '.MenuBarFixedCentered',
                        and centered in its parent container.
        MenuBarFullwidth - Grows to fill its parent container width.
    In general, all rules specified in this file are prefixed by #MenuBar so they only apply to instances of the widget inserted along
    with the rules. This permits use of multiple MenuBarBasic widgets on the same page with different layouts. Because of IE6 limitations,
    there are a few rules where this was not possible. Those rules are so noted in comments.
#MenuBar {
    background-color:transparent;
    font-family: Arial, Helvetica, sans-serif; /* Specify fonts on on MenuBar and subMenu MenuItemContainer, so MenuItemContainer,
                                                MenuItem, and MenuItemLabel
                                                at a given level all use same definition for ems.
                                                Note that this means the size is also inherited to child submenus,
                                                so use caution in using relative sizes other than
                                                100% on submenu fonts. */
    font-weight: normal;
    font-size: 17px;
    font-style: normal;
    padding:0;
/* Caution: because ID+class selectors do not work properly in IE6, but we want to restrict these rules to just this
widget instance, we have used string-concatenated classnames for our selectors for the layout type of the menubar
in this section. These have very low specificity, so be careful not to accidentally override them. */
.MenuBar br { /* using just a class so it has same specificity as the ".MenuBarFixedCentered br" rule bleow */
    display:none;
.MenuBarLeftShrink {
    float: left; /* shrink to content, as well as float the MenuBar */
    width: auto;
.MenuBarRightShrink {
    float: right; /* shrink to content, as well as float the MenuBar */
    width: auto;
.MenuBarFixedLeft {
    float: left;
    width: 80em;
.MenuBarFixedCentered {
    float: none;
    width: 80em;
    margin-left:auto;
    margin-right:auto;
.MenuBarFixedCentered br {
    clear:both;
    display:block;
.MenuBarFixedCentered .SubMenu br {
    display:none;
.MenuBarFullwidth {
    float: left;
    width: 100%;
/* Top level menubar items - these actually apply to all items, and get overridden for 1st or successive level submenus */
#MenuBar .MenuItemContainer {
    padding: 0px 0px 0px 0px;
    margin: 0;     /* Zero out margin on the item containers. The MenuItem is the active hover area.
                For most items, we have to do top or bottom padding or borders only on the MenuItem
                or a child so we keep the entire submenu tiled with items.
                Setting this to 0 avoids "dead spots" for hovering. */
#MenuBar .MenuItem {
    padding: 10px 10px 10px 4px;
    background-color:#000088;
    background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Navigation%20Bar%20Segm ent-Dark.png);
    background-repeat:repeat-x;
#MenuBar .MenuItemFirst {
    border-style: none none none none;
#MenuBar .MenuItemLast {
    border-style: none none none none;
#MenuBar .MenuItem .MenuItemLabel{
    text-align:center;
    line-height:1.4em;
    color:#ffffff;
    background-color:transparent;
    padding: 0px 18px 0px 5px;
    width: 10em;
    width:auto;
.SpryIsIE6 #MenuBar .MenuItem .MenuItemLabel{
    width:1em; /* Equivalent to min-width in modern browsers */
/* First level submenu items */
#MenuBar .SubMenu .MenuItem {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 15px;
    font-style: normal;
    background-color:#000088;
    padding:0px 2px 0px 0px;
    border-width:0px;
    border-color: #cccccc #cccccc #cccccc #cccccc;
    /* Border styles are overriden by first and last items */
    border-style: solid solid none solid;
#MenuBar .SubMenu .MenuItemFirst {
    border-style: none;
    padding: 0px;
#MenuBar .SubMenu .MenuItemFirst .MenuItemLabel{
    padding-top: 0px;
#MenuBar .SubMenu .MenuItemLast {
    border-style: none none none none;
#MenuBar .SubMenu .MenuItemLast .MenuItemLabel{
    padding-bottom: 10px;
#MenuBar .SubMenu .MenuItem .MenuItemLabel{
    text-align:left;
    line-height:1em;
    background-color:transparent;
    color:#ffffff;
    padding: 10px 10px 10px 10px;
    width: 240px;
/* Hover states for containers, items and labels */
#MenuBar .MenuItemHover {
    background-color: #2E35A3;
    background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Navigation%20Bar%20Segm ent%20Light2.png);
    background-repeat:repeat-x;
#MenuBar .MenuItemWithSubMenu.MenuItemHover .MenuItemLabel{
    background-color: transparent; /* consider exposing this prop separately*/
    color: #ffffff;
#MenuBar .MenuItemHover .MenuItemLabel{
    background-color: transparent;
    color: #ffffff;
#MenuBar .SubMenu .MenuItemHover {
    background-color:#2E35A3;
#MenuBar .SubMenu .MenuItemHover .MenuItemLabel{
    background-color: transparent;
    color: #ffffff;
/* Submenu properties -- First level of submenus */
#MenuBar .SubMenuVisible {
    background-color: transparent;
    min-width:0%; /* This keeps the menu from being skinnier than the parent MenuItemContainer - nice to have but not available on ie6 */
    border-style: none none none none;
#MenuBar.MenuBar .SubMenuVisible {/* For Horizontal menubar only */
    top: 100%;    /* 100% is at the bottom of parent menuItemContainer */
    left:0px; /* 'left' may need tuning depending upon borders or padding applied to menubar MenuItemContainer or MenuItem,
                    and your personal taste.
                    0px will left align the dropdown with the content area of the MenuItemContainer. Assuming you keep the margins 0
                    on MenuItemContainer and MenuItem on the parent
                    menubar, making this equal the sum of the MenuItemContainer & MenuItem padding-left will align
                    the dropdown with the left of the menu item label.*/
    z-index:10;
#MenuBar.MenuBarVertical .SubMenuVisible {
    top: 0px;
    left:100%;
    min-width:0px; /* Do not neeed to match width to parent MenuItemContainer - items will prevent total collapse */
/* Submenu properties -- Second level submenu and beyond - these are visible descendents of .MenuLevel1 */
#MenuBar .MenuLevel1 .SubMenuVisible {
    background-color: transparent;
    min-width:0px; /* Do not neeed to match width to parent MenuItemContainer - items will prevent total collapse*/
    top: 0px;    /* If desired, you can move this down a smidge to separate top item''s submenu from menubar -
                that is really only needed for submenu on first item of MenuLevel1, or you can make it negative to make submenu more
                vertically 'centered' on its invoking item */
    left:100%; /* If you want to shift the submenu left to partially cover its invoking item, you can add a margin-left with a
                negative value to this rule. Alternatively, if you use fixed-width items, you can change this left value
                to use px or ems to get the offset you want. */
/* IE6 rules - you can delete these if you do not want to support IE6 */
/* A note about multiple classes in IE6.
* Some of the rules above use multiple class names on an element for selection, such as "hover" (MenuItemHover) and "has a subMenu" (MenuItemWithSubMenu),
* giving the selector '.MenuItemWithSubMenu.MenuItemHover'.
* Unfortunately IE6 does not support using mutiple classnames in a selector for an element. For a selector such as '.foo.bar.baz', IE6 ignores
* all but the final classname (here, '.baz'), and sets the specificity accordingly, counting just one of those classs as significant. To get around this
* problem, we use the plugin in SpryMenuBarIEWorkaroundsPlugin.js to generate compound classnames for IE6, such as 'MenuItemWithSubMenuHover'.
* Since there are a lot of these needed, the plugin does not generate the extra classes for modern browsers, and we use the CSS2 style mutltiple class
* syntax for that. Since IE6 both applies rules where
* it should not, and gets the specificity wrong too, we have to order rules carefully, so the rule misapplied in IE6 can be overridden.
* So, we put the multiple class rule first. IE6 will mistakenly apply this rule. We follow this with the single-class rule that it would
* mistakenly override, making sure the misinterpreted IE6 specificity is the same as the single-class selector, so the latter wins.
* We then create a copy of the multiple class rule, adding a '.SpryIsIE6' class as context, and making sure the specificity for
* the selector is high enough to beat the single-class rule in the "both classes match" case. We place the IE6 rule at the end of the
* css style block to make it easy to delete if you want to drop IE6 support.
* If you decide you do not need IE6 support, you can get rid of these, as well as the inclusion of the SpryMenuBarIEWorkaroundsPlugin.js script.
* The 'SpryIsIE6' class is placed on the HTML element by the script in SpryMenuBarIEWorkaroundsPlugin.js if the browser is Internet Explorer 6. This avoids the necessity of IE conditional comments for these rules.
.SpryIsIE6 #MenuBar .MenuBarView .MenuItemWithSubMenuHover .MenuItemLabel /* IE6 selector */{
    background-color: transparent; /* consider exposing this prop separately*/
    color: #ffffff;
.SpryIsIE6 #MenuBar .MenuBarView .SubMenu .MenuItemWithSubMenuHover .MenuItemLabel/* IE6 selector */{
    background-color: transparent; /* consider exposing this prop separately*/
    color: #ffffff;
.SpryIsIE6 #MenuBar .SubMenu .SubMenu /* IE6 selector */{
    margin-left: -0px; /* Compensates for at least part of an IE6 "double padding" version of the "double margin" bug */
/* EndOAWidget_Instance_2141544 */
/* Ends Spry Menu Bar Widget 2.0 (1.0) Horizontal Menu Custom styles */
</style>
The CSS governing the site generally is reproduced below: (my belief is that it is the a:link, a:visited, a:hover, a:active styles that may be in conflict).
@charset "utf-8";
body {
    font: 100% Verdana, Arial, Helvetica, sans-serif;
    min-height: 0; /* This is necessary to overcome the "haslayout" bug that is found in Windows 7 in conjuction with IE8. For More information see: URL -- http://reference.sitepoint.com/css/haslayout.html */
    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 allows for the centering of the container and overcomes a bug inherent in IE 5 */
    color: #000000;
    list-style-image: none;
    background-color: #FCFCFC;
h1,h2,h3,h4,h5,h6 {
color:#000066;
a:link {
    color: #151A96;
    text-decoration: underline;
a:visited {
    text-decoration: underline;
    color: #1B8DCD;
a:hover {
    text-decoration: none;
    color: #F30A0A;
a:active {
    text-decoration: underline;
    color: #151A96;
#container {
    width: 960px;
    margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
    text-align: left; /* this overrides the text-align: center on the body element. */
    background-image:
    url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Midsection%20_960.png);
    background-repeat: repeat-y;
#header {
        padding: 0; /* 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. */
        width:960px;
        height:332px;
        background-image:
        url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Header_960.png);
        background-repeat:no-repeat;
#header h1 {
    margin-right: 0px; /* 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: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
    display:none;
#header img {
    display: none;
#Main_nav_contents {
    padding: 0;
    margin-top: 0px;
    height: 39px;
    width: 950px;
    padding-top: 275px;
    padding-left: 39px;
    z-index: 3;
#MenuBarVertical {
    margin-bottom: 50px;
    padding-top: 50px;
    padding-bottom:200px;
    padding-left: 15px;
    padding-right: 15px;
.mainContent_left {
    margin: 0;/* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
    padding-left:30px;
    padding-right:20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
    width: 600px;
    float: left;
.sidebar_right {
    float: right; /* since this element is floated, a width must be given */
    width: 270px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
    margin-top: 30px;
    margin-left:0;
    margin-right:10px;
    font-size:90%;
.mainContent_right {
    margin-left: 10px;
    padding-left:30px;
    padding-right:20px;
    width: 600px;
    float: right;
.sidebar_left {
    float: left; /* since this element is floated, a width must be given */
    width: 270px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
    margin-top: 30px;
    margin-left:30px;
    margin-right:0;
    overflow: hidden;
    font-size:90%;
.main_content_centered {
    width: 650px;
    margin-left: 155px;
.main_content_centered_header {
    margin-left: 75px;
.sidebar_textbox {
    margin: 0px;
    width: 260px;
    padding: 2px;
.sidebar_textbox_header {
    width:255px;
    height:58px;
    background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Portrait%20Textbox%20He ader.png);
.sidebar_textbox_background_middle {
     width: 255px;
    padding-top: 12px;
    padding-bottom: 10px;
    background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Portrait%20Textbox%20Mi ddle.png);
    background-repeat: repeat-y;
.sidebar_textbox_content {
    /* The width and padding are set as follows to accomodate quirks in browser rendering and to ensure that text is contained within the background of the text box */
    width: 230px;
    padding-left: 20px;
    padding-right: 40px;
.sidebar_textbox_footer {
    width:255px;
    height:64px;
background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Portrait%20Textbox%20Foo ter.png);
#issues_menu a:link {
    color: #151A96;
    text-decoration: none;
    font-weight:bold;
#issues_menu a:visited {
    color: #151A96;
    font-weight:bold;
    text-decoration: none;
#issues_menu a:hover {
    color: #F30A0A;
    font-weight:bold;
    font-style: oblique;
    text-decoration: none;
#issues_menu a:active {
    color: #151A96;
    font-weight:bold;
    text-decoration: none;
#archives {
    padding-top: 15px;
    padding-right: 15px;
    padding-bottom: 20px;
    padding-left: 0px;
.landscape_textbox {
    width: 500px;
    margin-right: 0px;
    margin-left: 30px;
    padding-top:35px;
    padding-bottom: 25px;
    font-style: normal;
    font-weight: normal;
.landscape_textbox_hdr {
    width:500px;
    height:38px;
    margin:auto;
    padding:0;
    background-image:
url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Landscape%20Textbox%20Header.png);
.landscape_textbox_middle {
    width:auto;
    margin:auto;
    padding-top: 12px;
    padding-bottom: 12px;
    background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/landscapte%20Textbox%20 Middle.png);
    background-repeat:repeat-y;
.landscape_textbox_content {
    width:450px;
    padding:25px;
.landscape_textbox_ftr {
    width:500px;
    height:44px;
    margin:auto;
    padding:0;
    background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Landscape%20Textbox%20F ooter.png);
#footer {
    padding: 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
    width: 960px;
    height: 222px;
    background-image:
    url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Footer%20_960.png);
    background-repeat:no-repeat;
#footer p {
    margin: 0px; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
    padding:0px; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
    text-align:center;
    margin-left: 50px;
    margin-right: 50px;
    padding: 10px;
    font-size: small;
#footer h5 {
text-align:center;
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
    float: right;
    margin-left: 8px;
.fltlft { /* this class can be used to float an element left in your page */
    float: left;
    margin-right: 8px;
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
    clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
.dropcap {
    display: block;
    float: left;
    line-height: 80%;
    font-size: 250%;
    font-weight: bolder;
    color: #000066;
    padding: .03em .1em 0 0;
.red_arrows {
    list-style-position: outside;
    list-style-image: url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Arrow%20Large.png);
.blue_bullets {
    list-style-position: outside;
    list-style-image: url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Bullet%20Medium%20Full.png);
.attention {
    color: #F30A0A;
    font-size:x-large;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-style: italic;
    font-weight:900;
.attention_small {
    color: #F30A0A;
    font-size:large;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-style: italic;
    font-weight:900;
.table {
    table-layout:fixed;
.blue {
    color: #00F;
#container .mainContent_left p .blue {
    color: #0303A0;

Hello Martin:
Thanks for your input. However I am not certain we have resolved this issue adequately, or understand the principles governing the css as regards this spry menu framework 2.0 (1.0).
For example, the menu only works in IE 6.0 if the css remains in the head. I agree with your original post that it shouldn't make any difference whether the css is posted in the head or in a separate style sheet (so long as specificity issues are addressed). Both should work -- and yet it doesn't.
If the CSS is placed in the separate style sheet governing the total site, it doesn't work for 6.0. If placed at the top of the style sheet, conflicts of specificity prevent the menu from rendering properly in any of the browsers causing the rules for general links to govern the menu.   This has been verified using a cross browser testing. If the styles are placed at the bottom of the style sheet to help them take precedence, they work in all the browsers except for IE 6.
The website I am building needs to support IE 6 for a variety of reasons, and because it is catering to the non-profit community and to low income persons, I am mindful of even small differences in page weight.
So for me, at least, the issue remains baffling.
I appreciate your input, but also would appreciate the input from others, and especially Adobe Community Professionals and employees. The spry framework in this regard is not well documented. I am not certain if this is exclusively a CSS problem, if it might also be complicated by the architecture of the spry framework, or if indeed other variables are at play.
I would be my hope that in resolving the problem, other users of the this particular spry framework might also benefit.
Thanks,
Steve.

Having problem with spry menu bar in Internet Explorer.

I'm having a problem with my spry menu bars in Internet Explorer.
Here are the pictures:
Firefox
Internet Explorer
HERE ARE THE CODES:
HTML CODE:
<style type="text/css">

</style>
<style type="text/css">
#apDiv3 {
    position:absolute;
    width:254px;
    height:206px;
    z-index:2;
    left: 123px;
    top: 1529px;
#apDiv4 {
    position:absolute;
    width:250px;
    height:194px;
    z-index:3;
    left: 381px;
    top: 1528px;
#apDiv5 {
    position:absolute;
    width:256px;
    height:200px;
    z-index:4;
    left: 636px;
    top: 1529px;
#apDiv6 {
    position:absolute;
    width:349px;
    height:205px;
    z-index:5;
    left: 889px;
    top: 1530px;
</style>
<style type="text/css">
#apDiv7 {
    position:absolute;
    width:887px;
    height:204px;
    z-index:6;
    left: 324px;
    top: 905px;
#apDiv8 {
    position:absolute;
    width:1295px;
    height:74px;
    z-index:1;
    left: 212px;
    top: 668px;
</style>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
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];}}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
</script>
<style type="text/css">
#apDiv2 {
    position:absolute;
    width:209px;
    height:197px;
    z-index:2;
    top: 1220px;
    left: 171px;
#apDiv9 {
    position:absolute;
    width:331px;
    height:97px;
    z-index:3;
    left: 385px;
    top: 1218px;
#apDiv10 {
    position:absolute;
    width:292px;
    height:199px;
    z-index:4;
    left: 724px;
    top: 1218px;
#apDiv11 {
    position:absolute;
    width:200px;
    height:115px;
    z-index:1;
body {
    background-color: #000;
    background-image: url();
    text-align: center;
    color: #F00;
.none {
    font-size: 80px;
    font-family: "Times New Roman", Times, serif;
    font-weight: bold;
#apDiv12 {
    position:absolute;
    width:991px;
    height:60px;
    z-index:5;
    left: 198px;
    top: 192px;
#apDiv13 {
    position:absolute;
    width:200px;
    height:115px;
    z-index:1;
    left: 588px;
    top: 322px;
</style>
<body onLoad="MM_preloadImages('images/WebConfroll.png','images/youthfootballroll.png','images/ statefbsweatshirt.png')">
<p align="center" class="none"><img src="images/footballtitle.png" width="941" height="183"></p>
<div align="center">
<ul id="MenuBar2" class="MenuBarHorizontal">
    <li><a class="MenuBarItemSubmenu" href="#">[Placeholder]</a>
      <ul>
        <li><a href="#">[Placeholder]</a></li>
        <li><a href="#">[Placeholder]</a></li>
        <li><a href="#">[Placeholder]</a></li>
      </ul>
    </li>
    <li><a href="#" class="MenuBarItemSubmenu">[Placeholder]</a>
      <ul>
        <li><a href="#">[Placeholder]</a></li>
        <li><a href="#">[Placeholder]</a></li>
        <li><a href="#">[Placeholder]</a></li>
      </ul>
    </li>
    <li><a class="MenuBarItemSubmenu" href="#">Videos</a>
      <ul>
        <li><a class="MenuBarItemSubmenu" href="#">2008 Videos</a>
          <ul>
            <li><a href="videos/2009 videos/Glenbard part one/partone.html">Glenbard South Game</a></li>
            <li><a href="#">             &# 160;         [Placeholder]</a></li>
          </ul>
        </li>
        <li><a href="#" class="MenuBarItemSubmenu">2009 Videos</a>
          <ul>
            <li><a href="#">[Placeholder]</a></li>
            <li><a href="#">[Placeholder]</a></li>
          </ul>
        </li>
        <li><a href="#" class="MenuBarItemSubmenu">2010 Videos</a>
          <ul>
            <li><a href="#">[Placeholder]</a></li>
            <li><a href="#">[Placeholder]</a></li>
          </ul>
        </li>
      </ul>
    </li>
</ul>
</div>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"><span class="cent"><img src="images/bulldoghelmit.png" width="150" height="99" /></span></p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p class="cent"> </p>
<div align="center">
<ul id="MenuBar1" class="MenuBarHorizontal">
    <li> <a class="MenuBarItemSubmenu" href="#">Football Season 2008</a>
      <ul>
        <li><a href="http://page.bps101.net/web/t1350/Football2009/2008%20Defense%20Stats.pdf">Defense Stats</a></li>
        <li><a href="http://page.bps101.net/web/t1350/Football2009/2008%20Offense%20Stats.pdf">Offense and Records</a></li>
        <li><a href="http://page.bps101.net/web/t1350/BHS%20All%20Time%20Stats.pdf">AllTime Data</a></li>
        <li><a href="http://page.bps101.net/web/t1350/Football2009/Western%20Sun%202009.pdf">Western Sun Final Standings</a></li>
      </ul>
    </li>
    <li> <a href="#" class="MenuBarItemSubmenu">Football Season 2009</a>
      <ul>
        <li><a href="http://page.bps101.net/web/t1350/Football%202010/2009%20Banquet%20Record%20and%20Stats.pdf">Defense Stats</a></li>
        <li><a href="http://page.bps101.net/web/t1350/Football%202010/2009%20Banquet%20Record%20and%20Stats.pdf">Record Book and Offense</a></li>
        <li><a href="http://page.bps101.net/web/t1350/Football%202010/All-Time%20Data%202009.pdf">Alltime Data</a></li>
      </ul>
    </li>
    <li> <a class="MenuBarItemSubmenu" href="#">Football Season 2010</a>
      <ul>
        <li><a href="http://page.bps101.net/web/t1350/Football%202011/2011%20Checklist.pdf">2010-2011 Offseason Checklist</a></li>
        <li><a href="http://page.bps101.net/web/t1350/Football%202011/2010%20Defense%20Stats%20Final.pdf">Defense Stats</a></li>
        <li><a href="http://page.bps101.net/web/t1350/Football%202011/2010%20Stats%20Packet.pdf">Record Book and Offense</a></li>
        <li><a href="http://page.bps101.net/web/t1350/Football%202011/2010%20ALL%20TIME.pdf">Alltime Data</a></li>
      </ul>
    </li>
</ul>
</div>
<p align="center"> </p>
<p align="center"> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"><img src="images/Batavia Youth football.png" alt="" width="869" height="200" /></p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image4','','images/WebConfroll.png',1)"></a></p>
<div align="center">
<div align="center"></div>
<div align="center"><a href="http://www.athletics2000.com/upstate8/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image7','','images/WebConfroll.png',1)"><img src="images/WebConf.png" name="Image7" width="206" height="194" border="0" id="Image7" /></a><a href="http://www.bataviayouthfootball.org/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image6','','images/statefbsweatshirt.png',1)"><img src="images/statefbsweatshirt.jpg" name="Image6" width="375" height="199" border="0" id="Image6" /></a><a href="http://www.bataviayouthfootball.org/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image8','','images/youthfootballroll.png',1)"><img src="images/youth football.png" name="Image8" width="329" height="197" border="0" id="Image8" /></a></div>
</div>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image5','','images/youthfootballroll.png',1)"></a></p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"><img src="images/Logos.png" width="1167" height="199" /></p>
<script type="text/javascript">
var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
CSS CODE
@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: auto 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    width: 54em;
    border-top: thick solid #00F;
    border-left: thick solid #00F;
    border-right: thick solid #00F;
    border-bottom: thick solid #00F;
    height: 2.2em;
/* 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;
    cursor: pointer;
    width: 18em;
    float: left;
/* 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: 18em;
    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: 18em;
/* 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: #000;
    padding: 0.5em 0.75em;
    color: #C96;
    text-decoration: none;
    text-align: center;
    height: 1.2em;
/* 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: #900;
    color: #009;
/* 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: #900;
    color: #FFF;
    text-decoration: underline;
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%;
    color: #FF0;
    font-family: "Lucida Console", Monaco, monospace;
/* 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;
The website is http://wwww.bataviabulldogfootball.tk

Note that running your page through the W3C Validator gives this list of errors: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.bataviabulldogfootball.tk%2F&charset=%2 8detect+automatically%29&doctype=Inline&group=0
I see that you have a very thin doctype at the top. I suggest you create a new page in Dreamweaver and copy the bit at the top of the page:
<!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" />
Then put that code in place of these lines from your current page:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
I see that you have two opening <body> tags. Delete one; it is not needed. Add the preload images from the second into the first body tag and delete the second.
I see code below the closing </html> tag. Re position it before the closing </body> tag.
Because of these errors mentioned above, it was impossible to see the page. Fix and reply here when you have done so.
Also, it is not possible for me to divine what difficulty you are having. If you can please also express it in English (LOL), I'll be happy to suggest a correction for you!
Beth
p.s. Posting entire blocks of code is NEVER as helpful as giving us a link to the pages in action. I seldom read through code dumps here in the Forum.
Message was edited by: Zabeth69

Problem with Spry Menu

I have two problems related with Spry Menubar in Dreamweaver CS3.
First I would like to make the menu transparent (I have a nice graphic I would like to show under). I cannot make it in IE. I wonder if anybody has any ideas.
Second my menu has a strange behaviour.
I use the following code to load a page named test1.html into a div named MyDiv of the page that has the menu:
<li><a href="javascript:loadURL('Test1t.html','Mydiv');" target="_parent">Item1.1</a></li>
the LoadURL function runs correctly.
However the first time I load the page in IE I need to click 2 times on Item1.1 to load test1.html. After that the menu works correctly loading test1.html with only one click. Pretty strange!!!!
Any help is very much appreciated.
Thanks,
Carly

Hi Charly,
CarlyJ schrieb:
Hi Hans,
Unfortunatelly the page is just on my machine.
Thanks,
C.
Then off to the server with your site and let us know the link!
Hans-G.

Safari bold text causing problem with Spry Menu Bar

I have made a web site using a Spry Menu bar. It worked fine across all browsers, as far as I knew. I was just alerted by th esite owner that the menu bar had the last link out of position when viewed in Safari. I'm not sure when this started happening. I notice the text in Safari is more bold than firefox or IE. My guess is that's the problem. I searched on google for help and found this
Add - text-shadow: 0 0 0 #000; to the css.
I tried that but it doesn't seem to have any effect.
the site is here:
http://www.telluridegravityworks.com/
Can anyone offer any advice on how I might fix this? Thanks!

I'm not seeing the issue in Win 7/Safari (assume it's a Mac issue) but I do see it in Win 7/IE9.
In the CSS file, http://www.telluridegravityworks.com/css/gravity-works-winter.css
tweaking the width of the navbar container fixes it here
#nav-menu {
width: 455px; /* adjusted from 445px */
padding: 0px;
overflow: hidden;
float: left;
margin-left: 515px;

Problem with spry menu bar position:fixed?

Hello technical heros,
I'm having trouble with my website's spry menu bar... here is the site.
As you can see, when you scroll down, the spry menu overlaps the header fixed block, which the rest of the content smoothly scrolls under. How do I tell the spry object to do the same?
I also want the sidebar 2 (menu bar) to be a fixed block like my header and footer. I know how to do this, but when I change the css, it throws my spry menu over to the left of the page, ontop of my sidebar 1.
Help, please!!

Hi,
Have a look here: http://www.w3schools.com/Css/css_positioning.asp
I hope this helps.
Ben

Internet Explorer Problem with Spry Menu Bar

http://www.cloud9industries.com/clients/jewelryworld/index4.html
OK here we go
#1) In IE, the toolbar doesn't appear with the same decreased
opacity as it does in Firefox and Safari. I'm using a png
background image with a transparent background and I've defined the
background color the same as the lower layer's color. Any ideas?
#2) THE BIG ISSUE - IE doesn't display the drop down portions
of the menu properly as they display horizontally. If the cursor
moves into the <li> from another <li> the menu displays
as aforementioned. If the cursor moves into the <li> from
outside the menu bar, the menu bar behaves properly.
This is the first page I've done with a Spry menu bar as it
seems the former navigation bar process has been removed from
Dreamweaver. Any tips will be greatly appreciated.
Thanks,
cloud9industries

Hi,
I took a look over your page and I noticed that you are using
a very old spry version 1.4. The current released version is Spry
1.6 and contains some major bug fixes for Menu Bar widget.
Please update to this last Spry version. You can download the
new files from
here.
The problem with the transparent background is an IE6 problem
which doesn't support transparent backgrounds. This problem is
fixed on IE7 and I check it and it works there.
Please let us know if you still have problems with MenuBar
after updating it to the new version
Thanks,
Diana

Problem with spry menu bar

i'm using dreamweaver CS3 to create a website using php
scripting. for some reason, my spry menu bar has become messed up.
it is now in bulleted form and the font and font color are all
wrong. i checked but the styles are turned on.. so how can i solve
this?

Find that some reason that the spry menu bar became messed up
and revert to how it was before that some reason occurred.
Hope that helps!

Problems with spry menu bar in IE

Hi.... I'm sorry if this has been covered somewhere, I promise I looked and couldn't find anything. I've been working with Dw for a little over a month now and have generally been able to find whatever I needed. But I've hit a wall: My pages display just fine in Opera, Safari, Firefox.... but in Mac's IE, none of the spry works (loaded from the server) and in Windows IE 7 & 8 the collapsible panels work but for the menu bar, the children menus come down from the top of the page (instead of below the parent). I've tried putting the menu in its own header container and the problem still happens. Nothing I do or can find as patches have helped make the Mac IE work (but from what I hear that's typical....). I am absolutely desperate for help!
The original page is: http://www.tumorvirology.pitt.edu
and a testing with the separate header can be seen at: http://www.tumorvirology.pitt.edu/dev/testsite/test1.html
The css files for the menu bar and panel for the first site is attached below.
Thank you so much for your time and help!
Susan

I have this exact same problem. My submenus are dropping down from the top of the screen in IE. I did what you suggested here and it did not work for me. Help! Here is my CSS:
@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;
position: inherit;
left: 98px;
top: 234px;
/* 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
/* 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: 7.5em;
float: left;
background-color: #D35D35;
/* 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%;
cursor: default;
width: 8.2em;
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;
position: absolute;
z-index: inherit;
top: auto;
#leftnav {
padding: 7px 5px 5px;
width: 158px;
float: left;
height: auto;
position: absolute;
z-index: 20;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
width: 8.2em;
/* 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: #D35D35;
padding: 0.5em 0.75em;
color: #FFFFFF;
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: #D35D35;
color: #333333;
/* 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: #D35D35;
color: #333333;
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: inherit;
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;

Problem with Spry Menu Crashing i.e. 7.0

Here is the site address www.skiotter.com It's odd - ie6 on another computer works fine - ie 6 on a third computer crashes - the crash is essentially a freeze during the homepage load.
Any help would be greatly appreciated. Thanks!

Here is the site address www.skiotter.com It's odd - ie6 on another computer works fine - ie 6 on a third computer crashes - the crash is essentially a freeze during the homepage load.
Any help would be greatly appreciated. Thanks!

Problem with spry in IE

hey guys im having a problem with Spry in IE only..
Ive tried the corrent browsers and it seems to be working well
Firefox
Opera
Safari
but Internet Explorer is not working the menus just wont drop down past my flash player?
any help would be great
heres the link to my temp site so you guys can see what i mean
www.dreamcatchermeadows.com/new_site/site/index.html
any help would be great
Thanks

i checked the compatability button on dream weaver and this come up
Dreamweaver Browser Compatibility Check
14-February-2011 at 01:26:05 PM GMT-08:00.
Target Browser Errors Warnings
Internet Explorer 6.0
1
0
Internet Explorer 7.0
1
0
Internet Explorer for Macintosh 5.2
1
0
Firefox 1.5
1
0
Netscape 8.0
1
0
Opera 8.0
1
0
Opera 9.0
1
0
Safari 2.0
1
0
Total
8
0
Details:
#000000
#000000
Error
Found 1 errors in SpryMenuBarHorizontal.css
Firefox 1.5; Internet Explorer 6.0, 7.0; Internet Explorer for Macintosh 5.2; Netscape 8.0; Opera 8.0, 9.0; Safari 2.0
line 19
<link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
End of report.

Canon 860 Series (Pixma) Printer Problems with OSX 10.8 (Mountain Lion) – links to Canon Support Site with Drivers and Software with install tips

After spending several hours sorting out Canon Pixma OSX problems here are my thoughts:
Canon 860 Series (Pixma 868) Printer Problems with OSX 10.8 (Mountain Lion) – links to Canon Support Site with Drivers and Software with install tips
Problem:
- New imac and MacBook Pro 2012 (OSX 10.8.2) had a problem using Canon Pixma 868 printer on network and would not scan or print using Canon Pixma software (Pixma MP Navigator 2.1 & Photo Print), which has advanced scanning and photo printing functions.
- When I connected the canon printer to my imac, OSX 10.8.2 automatically downloaded and installed drivers for Canon 860 series printer. I could then add the new printer (select ‘apple menu’ / ‘system preferences’ / ‘print and scan’ / “+”) and printer would work while connected via USB but could not get to print or scan over network wifi.
- The original Canon 860 Series CD does not work with 10.8 and the manual / online instructions did not make sense (as based on CD install).
Solution:
1) Install Canon Printer Drivers and Software (from official Canon site)
Go to canon support site, review FAQ, then download and install following Pixma 860 Series software & drivers for OSX 10.8 (links see below). The version I downloaded is in brackets but check for updated version. Full instructions are below.
Canon 860 Series Drivers & Software for OSX 10.8 Mountain Lion:
The base software and drivers needed for using Canon 860 Series on Mac OS X 10.8 (USB) are
1 Printer Driver
(Canon MX860 series CUPS Printer Driver Ver. 10.67.1.0 (03-Aug-2012))
2 Scanner Driver
(Canon MX860 series Scanner Driver Ver. 14.11.4a (03-Aug-2012))
3 Network Tool
(Canon IJ Network Tool Ver. 4.1.0 for Intel Mac (27-Dec-2012)
Canon Software for using advanced printing and scanning functions (while connected to network)
4 Solution Menu
(Canon Solution Menu Ver. 1.4.1 (27-Jul-2012 ))
5 MP Navigator EX
(Canon MP Nav EX Ver. 2.1.3 (02-Auf-2012))
6 Easy-PhotoPrint EX
(Canon Easy-PhotoPrint EX Ver. 4.1.6 (21-Jan-2013 ))
Canon Support (HK) – check your local site
http://www.canon.com.hk/en/download/main/index.do
Select Product and drivers from support site eg http://support-hk.canon-asia.com/
1. Choose a product category
Multifunctional Printers
2. Choose a product series
Pixma
3. Choose a product model
Pixma MX868
4. Choose type of document
Downloads or FAQ
If you have problems installing the software under 10.8, see the FAQ on Canon site. You will need to allow software installs from “unidentified developers by using “Control” Key or by changing your system preferences)
2) Check Canon Printer and Software Working while connected via USB
Once you have downloaded and installed drivers and software and restarted computer, check that the printer and Canon Pixma software (Pixma MP Navigator 2.1 & Photo Print) are working via USB. Open the Canon IJ Network Tool App (Applications / Canon Utilities /IJ Network Tool / Canon IJ Network Tool App) and make sure you can see the Canon MX 860 series (xx.xx.xx.xx.xx.xx) and that it shows the correct SSID Wifi settings (under the Canon IJ Network Tool App ‘Setup menu’). This is normally done as part of the automatic install but worth double checking
3) Add new network printer using ‘apple menu’ / ‘system preferences’ / ‘print and scan’ / “+”).
After you have checked USB printing turn off printer, unplug the USB cable and shutdown the Canon IJ Network Tool App.
Then turn the printer back on and wait 30s. Then add a new printer using ‘apple menu’ / ‘system preferences’ / ‘print and scan’ / “+”). Once you select “+” (add new printer), wait 10-30s for the Wifi Networked Canon MX 860 Series printer to appear in the new window eg Canon MX 860 series (xx.xx.xx.xx.xx.xx) (Kind: “Canon IJ Network”)
DO NOT ADD THE MX 860 SERIES BONJOUR SCANNER (the Bonjour Scanner is the built-in software, is not needed and often appears first on the add printer list). The Canon scanner can be accessed used through the MP Nav EX Ver. 2.1.3 software (which has much better functions)
You will now have two Printer Canon MX860 (USB) and Canon MX860 (Wifi / Network). Set the Canon MX860 (Wifi / Network) as default and test print and scan
If the Wifi Networked Canon MX 860 Series printer does not appear, check the printer and make sure that the printer can see the wifi network. On the printer select Menu / Settings / Device Settings / Lan Settings / WLAN Setting List. It should say WLAN Active, identify the SSID and have an IP address
If the printer can not see the Wifi Network, plug the USB cable back in, then open the Canon IJ Network Tool App (Applications / Canon Utilities /IJ Network Tool / Canon IJ Network Tool App). Make sure you can see the Canon MX 860 series (xx.xx.xx.xx.xx.xx) and that it has your SSID settings (under setup), if it has this info, restart the computer and the printer and try again

Hi, thaks for response, meant to post as a discussion (not question), wanted to save others time if they get the same problem

Printer problem with AW 6.2.9

I have a recurring printer problem with both hp deskjet 5150 and Epson R220. After much work with techs at both, we have determined that it is an AW problem (v. 6.2.9) Other files print okay. I've searched through recent posts and found similiar questions, but the answers aren't specific to my problem. I gather that it involves trashing certain AW files, such as Appleworks.plist and other Appleworks prefs. It will help it I know the specific files to trash and as much detail about how to find them on the HD. I will be infinitely grateful for any help.
OSR
Mac G4 Mac OS X (10.4.6)
Mac G4 Mac OS X (10.4.6)

Welcome to Apple Discussions
You are correct that deleting the AppleWorks preferences can fix some printing problems. I'm surprised that in finding that information you didn't come across a post with the specific information or a tip to my user tip, AppleWorks has stopped working correctly, that explains which preference files ot delete.
Make sure you have the newest printer driver for each printer. Also, use Disk Utility to repair permissions after any system update or upgrade.

Printing Problems with PDF - Adobe Acrobat

Printer - HP Deskjet 3070A
Laptop - Asus Zenbook running Windows 7 Home Premium
Issue: Printing problems with PDF (Adobe Acrobat Reader)
Dear All,
Please help!
My printer was working absolutely perfectly until my brother in law recently needed to borrow my printer. He plugged in his laptop running Windows 8 (awful thing that is). Since he did this to print his own PDF, I cannot print mine.
Although all the text will appear on the page perfectly both in the document view and on actual printing, it appears that some of the transparent formatting stuff on a PDF - such as boxes you have to fill in and transparent areas (such as you find on glorious tax forms) are omitted completely. In fact, in their place I was getting a single black dot. Now, after uninstalling and re-installing updates for the printer, windows 7, adobe acrobat reader, etc.etc. I get squat. Just all the text laid out but none of the shading or boxes.
I have tried fiddling with the printer settings; the print as 'photo' option, dpi settings, greyscale - as much as I can think of and I am thoroughly stumped.
In a desperate attempt, I even installed the Universal Printer Drivers - thinking it might have been that. No. All I got was a page of gobbledygook. Consequently, I uninstalled and reinstalled the normal drivers again.
If there are any wonderful people out there with any fabulous ideas about how I can get my shading and boxes back; I'd very much appreciate it. Sadly I have a tax return to fill out (which is already fabulously late) and need my printer to work!
Much appreciation in advance x

Hey there @Reverie!
Thanks for posting on the HP Forums!
I can see that the printer is no longer printing in the correct format after it was plugged into the Windows 8 computer! You mentioned you have run the updates and uninstalled/re-installed the printer software. Have you uninstalled and re-installed the Adobe software? Are you getting the same issue from other programs as well? Are you getting the same issues if you are logged in as a different user on the computer?
I have located the HP Update Software Utility that may be able to help. You can download an run the utility. It may be able to locate any other updates for the printer.
I would also recommend running a disk cleanup on the computer to clear any temporary files and junk files that may be causing some performance or software issues. If you do not know how to run a disk cleanup on the computer please follow this document regarding Delete files using Disk Cleanup. It is recommended to restart the computer after a disk cleanup. After the restart try the print job again!
Let me know if that helped and thanks again for posting on the HP Forums!
Cbert
I work on behalf of HP.
Please click “Accept as Solution” if you feel my post solved your issue, it will help others find the solution.
Click the “Kudos, Thumbs Up" at the bottom of this post to say “Thanks” for helping!

Printing Problems with Spry Menu. Help?

Similar Messages

Maybe you are looking for