SPRY menu background transparency

Is it possible for the spry menu object to use a transparent
background? I'm assuming the white background that shows up when
you remove all of the menu's background colors is an iFrame meant
to keep the menu from slipping behind form elements...is there any
way to disable this behavior? Thanks in advance.

Hi,
please try to add on this rule:
ul.MenuBarHorizontal li the following property: opacity:0.3;
(this will work only for FF, for IE you should have:
filter:alpha(opacity:30))
We have a fix for the next spry release version, about
iframes: on this rule ul.MenuBarHorizontal iframe add:
filter:alpha(opacity:0.1);
Hope this helps,
Diana

Similar Messages

  • Making spry menu background transparent

    Hello
    I have made a spry menu and made the background transparent.
    Works in Safari and Firefox on my mac but on a pc (IE) it is white.
    How can I change this? (I'm fairly new at this) Thanks

    Hello DrJeff08
    I'm happy to report that I did manage to solve my problem,
    perhaps if we're lucky we'll solve yours too. (This is my first
    website with Dreamweaver and first time using CSS). I went to my
    CSS panel in order to view all the rules I'd created, opened up the
    Spry CSS rules and methodically checked all of the properties for
    each of the rules. The very last entry on that style sheet was one
    that I didn't create, called ul.menuBarVertical li.MenuBarItemIE
    (the "IE" that I see at the end of that name gave me a clue that it
    relates to Internet Explorer) I noticed that the background was
    white so I simply removed the white background. It must have been
    automatically inserted as a default background color.
    Hope it helps!

  • Spry Menu Bar transparency problem - one solution

    Like many other people I have spent several frustrating days trying to solve the problem of Spry Menu Bar sub-menus appearing to be transparent (text, etc. underneath the sub-menus shows above/through the sub-menu items). This problem manifested itself in IE7, but not in Netscape, Safari or Firefox.
    I thought it must be the dreaded IE z-index problem.
    I have been through most other people's questions and replies on the Adobe forums, tried all kinds of z-index changes and various other mods to my own CSS and/or the Spry CSS's - all to no avail.
    My situation:
    I have a Spry Menu Bar above a clicktrail and a text block. Both the clicktrail and the text block showed through the sub-menu items, which drop-down over them.
    All three items are located in relative-positioned divs, necessary because the whole page design is contained in a self-centralizing container div and absolute-positioned divs screw up the whole page layout when the screen size or browser window size changes.
    (Sorry, I can't upload the files to a website at the moment.)
    The solution that works for me in Dreamweaver CS4:
    I selected the divs for the clicktrail and the text block, one at a time, and selected Modify > Arrange > Send to Back in Dreamweaver CS4.
    I then selected these two items again and selected Modify > Arrange > Bring to Front.
    Finally I selected the div containing the Spry Menu Bar and selected Modify > Arrange > Bring to Front. The thought behind this was that this would put the Spry Menu Bar on top of everything else - and it works!
    This solution works in all four browsers, but don't ask me how! I can't see any change in any CSS, nor in my template code. All I can see is a strange, flashing vertical line (like an enormous cursor - about 10 cm [3"] high) in the middle of the template page only (and only in Dreamweaver) if I click on the page background. I can neither find an explanation for this nor anything in the coding which might cause it. By the way; the z-index for the menu div =2, the z-index for the clicktrail div is not defined and the z-index for the div for the text block is set to auto. I haven't tried other values and to be honest I'm not sure what they were set to before I applied the above 'solution'.
    But hey - who the hell cares - my site works!
    I hope this helps someone else out of an absolute hell-hole...if someone out there can explain where to find the code that had been changed or added by doing this I'd like to know. I don't like things I can't explain - even if they do work!

    This is where the browser is told to supply a white background
    ul.MenuBarHorizontal a
         display: block;
         cursor: pointer;
         background-color: #fff;
         padding: 0.5em 0.75em;
         color: #333;
         text-decoration: none;
    Vhange the value to transparent.
    Also the last line int the CSS should be removed as in
    filter: "alpha(opacity=60)";
    Gramps

  • Spry Menu background is white in IE

    I've created a vertical Spry menu with submenus. The menu should not have a background color, so it should take the color of the image it's on top of. This looks fine on Safari (Mac) and Firefox (Mac/Windows), but on IE 8 (Windows), the menu background is WHITE. This makes it difficult to see the menu items. What can I do so that the menu background is transparent and does not show up white in IE?
    The site: http://chrysacupuncture.com
    I'm attaching index.html, my own css file, and the Spry css file.
    Thanks for your help.

    Actually, now that I look at it, I think one of your IE hacks might be malfunctioning:
    /* 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.MenuBarVertical li.MenuBarItemIE
              display: inline;
              f\loat: left;
              background: #FFF;
    This is the bottom-most item in your CSS file.  Notice the typo in the float:left and that it does indeed state a white background background:#FFF.  I don't usually put IE hacks external CSS, you might try moving it to the main HTML file and using IECC.  Place it in the header as you would if you had internal CSS:
    <!--[if IE 5]>
    <style type="text/css">
    ul.MenuBarVertical li.MenuBarItemIE
              display: inline;
              float: left;
    </style>
    <![endIf]-->
    I removed the background color altogether, but you may have to define one (I don't usually support IE5 so I'm not sure).
    If you insist on having this hack externally, you can try placing the background: transparent in the first item of your CSS:
    ul.MenuBarVertical
         margin: 0;
         padding: 0;
         list-style-type: none;
         font-size: 100%;
         cursor: default;
         width: 9em;
         padding-top: 80px;
         background: transparent;

  • Spry menu bar transparency in Internet Explorer 8

    Hello all, I've searched for this one but can't seem to find a solution that works. I'm using DW CS5 and I've included a spry menu bar and transparency on the site works great everywhere else except for the menu bar. I tried to use the hack to change the background to "transparent" but that did not work. Also, the site works fine in other browsers such as Firefox and Chrome but the spry menu bar is the only this that sticks out like a sore thumb in IE8. Please any help is appreciated and I thank you in advance.

    This is where the browser is told to supply a white background
    ul.MenuBarHorizontal a
         display: block;
         cursor: pointer;
         background-color: #fff;
         padding: 0.5em 0.75em;
         color: #333;
         text-decoration: none;
    Vhange the value to transparent.
    Also the last line int the CSS should be removed as in
    filter: "alpha(opacity=60)";
    Gramps

  • Changing Spry Menu Background

    So I decided to spice up my page a little by adding a
    background image to my spry menu buttons.
    After creating an image I went to "ul.MenuBarVertical a" and
    set my new image as the background, worked fine.
    Same image with a triangle on right for a submenu button in
    "ul.MenuBarVertical a.MenuBarItemSubmenu" worked fine.
    Hover image in "ul.MenuBarVertical a:hover,
    ul.MenuBarVertical a:focus" works fine.
    But I can't seem to change the background image for hovering
    over a submenu button. I assumed it would go in "ul.MenuBarVertical
    a.MenuBarItemSubmenuHover" but when I hover over it the image just
    isn't right. I've looked at all the rules for my spry menu and have
    no idea what is wrong, help please, thanks in advance.

    It is always best to read the comments within the CSS.
    For instance, the first lot of style rules come under the heading
    LAYOUT INFORMATION: describes box model, positioning, z-order
    Then there are style rules that come under the heading of
    DESIGN INFORMATION: describes color scheme, borders, fonts
    Other headings are
    SUBMENU INDICATION: styles if there is a submenu under a given menu item
    and
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    As for highlighting there are the following
    /* 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: #33C;
        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;
    Gramps

  • Spry Menu Background Stops After Text

    I made a Spry Vertical Menu in DCS4. When I look at it in the browser, the background only extends the length of text...I want it to extend across the box equally for all the menu choices. I have looked at all the CSS properties and changed the values, but nothing seems to affect the length of the backgrounds. Can you offer any suggestions? You can see the page at http://www.stepbystepcare.org/index4.html

    1. Resurrect the original SpryMenuBarHorizontal.css, too many irregularities in the modified one.
    2. remove line 18-20 from the main document
    3. add a closing UL-tag to line 83 main document
    4. Then add the following to the bottom of the original SpryMenuBarHorizontal.css
    ul.MenuBarHorizontal {
        width: 940px;
        margin: auto;
        font-family: 'Oswald', sans-serif;
        font-size: 14px;
        letter-spacing: 1px;
    ul.MenuBarHorizontal li {
        width: auto;
    ul.MenuBarHorizontal ul {
        width: auto;
    ul.MenuBarHorizontal ul li {
        display: block;
        float: none !important;
        width: auto;
        white-space: nowrap;
    ul.MenuBarHorizontal a {
        color: #B5B5B5;
        text-transform: uppercase;
        padding: 1.1em 3em 1.1em 1.5em;
        background: url(../images/img03.gif) repeat-x -100px;
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus, ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible {
        background-color: transparent;
        color: #FFF;
    ul.MenuBarHorizontal li.MenuBarItemIE {
        background: url(../images/img03.gif) repeat-x -100px;

  • Spry Menu Background image not working in IE

    I have created a website using Dreamweaver CS5 and having trouble with my Spry bar in internet explorer. It looks great in chrome, firefox, etc, but in IE there is a white background instead of my background image and the submenus have moved WAY right.. can someone help me!
    SpryMenuBarHorizontal.CSS is below:
    @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: 800px;
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
    z-index: 1000;
    /* Menu item containers, position children relative to this container and are a fixed width */
    ul.MenuBarHorizontal li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: center;
    cursor: pointer;
    width: 160px;
    float: left;
    background-image: url(file:///E|/MAIN_website/images/menu_background.jpg);
    ul.MenuBarHorizontal li a{
    color:#FFF;
    ul.MenuBarHorizontal li li{
    background-image: url(../images/menu_background1.jpg);
    ul.MenuBarHorizontal li li a{
    color:#000;
    ul.MenuBarHorizontal li li li{
    background-image: url(file:///E|/MAIN_website/images/index_06.jpg);
    ul.MenuBarHorizontal li li li a{
    color:#FFF;
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover,
    ul.MenuBarHorizontal a.MenuBarSubmenuVisible{
    color:#33CCFF;
    /* 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: 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;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
    width: 160px;
    /* 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;
    padding: 0.5em 0.75em;
    color: #FFF;
    text-decoration: none;
    font-family: Cambria, Arial, sans-serif;
    font-size: 14px;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    color: #FFF;
    text-decoration: underline;
    /* [disabled]background-image: url(file:///E|/MAIN_website/images/menu_background.jpg); */
    /* 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;
    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;

    Because I can't see your site and code in context, I will make a guess that this style is throwing off your alignment:
    /* 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: center;
    cursor: pointer;
    width: 160px;
    float: left;
    background-image: url(file:///E|/MAIN_website/images/menu_background.jpg);
    Remove the text-align:center; from the above style.
    Instead of centering your list element (li), center the link text (a) itself:
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    padding: 0.5em 0.75em;
    color: #FFF;
    text-align: center;
    text-decoration: none;
    font-family: Cambria, Arial, sans-serif;
    font-size: 14px;
    If you don't want the submenu text to be centered, do this immediately after the previous style:
    ul.MenuBarHorizontal ul a {text-align: left;}
    The sub-submenus are also set up by default to be jogged a bit to the right. You can adjust this style:
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
    position: absolute;
    margin: -5% 0 0 95%;
    that causes sub-submenus to fly out to the right of the submenus to which they attach.
    Submenus themselves (not the sub-submenus) should fall directly under the top menu item by default, once you remove the text-align: center; on the li item (above).
    Beth

  • Spry menu Background color IE

    The background color of one of my menu items (the only one which includes a submenu) appears as white instead of blue in Internet Explorer 8.0
    Any tips on how to correc this? I'm using Spry 1.6 - maybe I should download the Spry 2.0 Widget? If I do that, do I have to recreate the entire menu?
    http://www.studio2adv.com/dev/gibson
    Thanks in advance for any advice.

    Sorry, didm't have time to test this but try changing the css background: #FFF;
    /* 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;

  • Spry Menu Background

    I've seen this question posted around various places but
    haven't seen a direct answer to it; or maybe I've overlooked it.
    How can I make the background for the pop out menus
    semi-transparent? (For IE7, Safari, & Firefox2)
    Thanks in advance!

    You need to set up a special class and apply it to the LI for
    the sub
    menus...
    if you look at this page I put up yesterday, you can see that
    I have a
    different color for the subs (not opaque, but you do that by
    adding the
    opacity styles to the class)
    http://www.perrelink.com.au/beauty/
    Check out the stylesheet and look for the #MenuBar1 .flyout a
    and check the html code to see where I applied the class.
    Nadia
    Adobe® Community Expert : Dreamweaver
    CSS Templates |Tutorials |SEO Articles
    http://www.DreamweaverResources.com
    ~ Customisation Service Available ~
    http://www.csstemplates.com.au
    Spry Widget Examples
    http://www.dreamweaverresources.com/spry-widgets/
    "jedweb" <[email protected]> wrote in
    message
    news:f60keo$r2d$[email protected]..
    > I've seen this question posted around various places but
    haven't seen a
    > direct
    > answer to it; or maybe I've overlooked it.
    >
    > How can I make the background for the pop out menus
    semi-transparent?
    > (For
    > IE7, Safari, & Firefox2)
    >
    > Thanks in advance!
    >

  • Spry Menu Background Color

    I've created a spry vertical menu with a black background.
    When I mouse over one of the menu items and the sub menu appears, I
    would like it to have a different color background than the main
    menu. Anyone know how to accomplish this?
    Thank you>

    Sorry, didm't have time to test this but try changing the css background: #FFF;
    /* 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;

  • Background png doesn't show right in vertical spry menu in IE

    Hi,
    My vertical spry menu background gradient png is fine in Firefox, Safari, Chrome, etc. But in IE it shows white. I have it posted on a temporary site: http://bethniebuhr.com
    Can you help me fix the IE?
    Thanks.

    At the bottom the SpryMenuBarVertical.css you have
    /* 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.MenuBarVertical li.MenuBarItemIE
                  display: inline;
                  f\loat: left;
                  background: #FFF;
    Either set the value to transparent or remove the line altogether.
    Gramps

  • Transparent spry menu that has a background color on sub menus and a few other problems(Please Help)

    Hi im a noob at dream weaver and i've been trying to create a menu and i have been having problems with this menu bar i don't know what to upload and i have made a topic about this before but i only got one reply and so i am trying to make my menu bar transparent and then the sub menu's colored with the color code #1A1A1A and the menu bars that have been color background are only the sub sub menu bars if you know what i mean and also my other problem is the spacing i have between each option is really uneven is there a way to make them evenly sperated apart from each other rather than just the size of a "box" that the text is in. Here is my SpryMenuBarHorizontal.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: 0 auto;
              padding: 0;
              list-style-type: none;
              font-size: small;
              cursor: default;
              width: 100em;
    /* 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: 18px;
              position: relative;
              text-align: left;
              cursor: pointer;
              width: 10.8em;
              float: left;
              visibility: visible;
    /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarHorizontal ul
              margin: 0;
              padding: 0;
              list-style-type: none;
              font-size: 100%;
              z-index: 1020;
              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;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
              width: 15em;
    /* 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
    ul.MenuBarHorizontal ul
              border: 0px solid #1A1A1A;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
              display: block;
              cursor: pointer;
              background-color: transparent;
              padding: 9px;
              color: #FFF;
              text-decoration: #1A1A1A;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
              font-weight: bold;
              font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
              font-size: 18px;
    /* 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: #0048ff;
              color: #EEE;
    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-color: #1A1A1A
              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-color:#1A1A1A;
              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-color:#1A1A1A
              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-color: #1A1A1A
              background-repeat: no-repeat;
              background-position: 85% 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-color: #1A1A1A;

    See if this post helps :
    http://forums.adobe.com/message/1997762#1997762
    and this one:
    http://forums.adobe.com/message/1898539#1898539
    Nadia
    Adobe® Community Expert : Dreamweaver
    http://www.perrelink.com.au
    Unique CSS Templates | Tutorials | SEO Articles
    http://www.DreamweaverResources.com
    http://twitter.com/nadiap

  • Need transparent background color in Spry Menu Bar

    Tried every possible combination.
    Built a 150x1000 px header in Illustrator with a 20x1000 px rectangle at the bottom for the nav bar, set as a background image in the header within Dreamweaver.
    Can not make a transparent (no color) background within Spry Menu Bar: MenuBar1??
    Also, my first nav is 'Welcome' that <li></li> is about 6-8 px higher then the rest of the nav bar??
    Any help at all would be appreciated, thanks
    optionsclinic.net

    Have you tried changing the value of the Background colour in your CSS:
    ul.MenuBarHorizontal a
        cursor: pointer;
        text-align: center;
        padding-top: 2px;
        padding-bottom: 2px;
        text-decoration: none;
        color: #FFF;
        padding-right: 2px;
        padding-left: 2px;
        display: block;
        background-color: #223F9A;

  • Spry Menu problem with using a transparent background image

    Hi-  I'm new to CS5 and Dreamweaver. I just finished the beginning webpage tutorial and I have started to work on a personal project. The Problem: when I use a transparent png image as a backgroun-image for my spry menu it shows up fine in live view, but doesn't work in browser view (safari), in fact the menu reverts to it's original grey and blue boredom. Does anyone have a solution for me? Does this mean it will be grey and blue when it goes live? Thanks, Ruth333333

    Please supply a link to your site.
    Gramps

Maybe you are looking for

  • Why can't I access photos on my desktop after iOS 7 update?

    I'm using windows 7 and when I connect my iphone to my computer I can see my iphone come up as a camera icon, as usual.  I click into it and there is a DCIM folder but it's empty.  I used to be able to access all the photos on my phone until I update

  • IPod reads only 18.8 GB

    I just got a 30 GB iPod 5g today and while i was transferring a large amount of songs the damned thing froze. So i figured because a group of files on it were corrupted i'd just reformat (In windows using Fat32) and play it safe and use the updater.

  • Live Internet audio stream not functioning after iTunes 10.5.3 update

    Today my iTunes listed Internet audio stream for a local radio station will not play. i did perform the iTunes update for 10.5.3 3 days ago and the stream funcitoned then, but not today. Ugh. Any hints? Thanx everso!

  • ABAP lowercase entries in tables

    When we make entries for tables through se11 or se16 in lowercase but DB is taking in uppercase how is it? Is there any option(menu) available in standard sap?

  • How can i translate the page????

    How can i translate the page