Spry Menu problem: no menu style on mobile devices

I created a simple menu horizontal spry, with sub menu for a site using a fluid design.

When looked at in the preview of the multiplayer mode, everything looks fine, however if I load a page and check the menu on a smart phone (Nokia), or an Ipad or Kindle is not displayed but is repaced with a liswt of the menu of options with bullets near the entrance.

What I am doing wrong?

Sorry to say, Spry menus do not work on handheld devices.

You need to move your menu systems to a

HTML/CSS menu or perhaps of JQuery. See some examples here:

http://Apycom.com/

Tags: Dreamweaver

Similar Questions

How to create a menu burger for mobile devices with submenus?

Hello
I don't understand why Muse have still a self building mobile menu as it does for Desktop - Web sites. All other tools like RapidWeaver done!
So I have to build my own burger menu manually. The problem is: How can I build with the submenus? Levels got more complex Web site and it would be much better, if the user can access directly through each of them on a mobile device in a burger menu.
Can anyone help?

I don't see what you want potential problems.

Not 100% what you want, but the simple option is to nest panels in accordion inside each other. I spent 10 minutes during lunch at one place scheme (the burger is bad image and size of items is all wrong, but you can play with it (and change from pretty bad looking for something OK/good)).

Mock up quick hamburger

If you really want a slide from the right as in the example you have pointed out, you need to insert some html/css:

-build the submenu just next to the page and the group. Listen to samples and inspect the element chromium to find the UID of the group. The click of the menu item, call the submenu UID and move the element on the page. Include the ease settings to soften the transition.

Can go more in detail if you wish.

Good luck and sorry is not the prettiest workaround. Maybe build widget a day.

Problem connecting Bluetooth with Windows Mobile Device Center

Hello

I have and HTC Snap with WM 6.1 I want to connect to my Satellite P500 running Windows 7 to be able to move the files by using Windows Mobile Device Center.

I know that this device can talk to this laptop via bluetooth, because there are some utilities bluetooth Toshiba that I can use to get a connection.

However, even if the Toshiba utility recognizes my bluetooth device, but WMDC is not. WMDC recognises my device when it is connected with a USB cable.

I don't know about the drvupdate-amd64 download which I think is necessary with WMDC but when I run what it looks like all it does is try to install a device driver for a device that is 'unknown '. I get a message at the end that driver could not be installed.

I have run out of ideas on how to get these things to work. Someone at - it a similar experience?

Could this be a problem of COM port? My Bluetooth device to 40 com affected Toshiba stack I don't see a COM 40 in the WMDC, just a port identified as "Bluetooth" settings

Post edited by: t5247rb

Hello

This page of Toshiba Bluetooth may be able to help you;
http://APS2.toshiba-tro.de/Bluetooth/?page=HOWTO

Here are very interesting HowTo documents;
In your case I recommend that you check the docs:

+ How do I set up a connection from the PDA (Windows Mobile 6) to the Windows Mobile Device Center.

and

+ How to connect PC to internet via Bluetooth using a Windows Mobile 6 phone +.

Welcome them

Problems with audio playback on mobile devices

Each project we export and reading on mobile device has a problem.
We hear only audio track 2 off maybe 3 on different projects. Our audio tracks are stacked like this:
Track 1 - camera Audio / dialogue
Track 2 - music
Track 3 - sound design (some projects, not all)
None are dumb or the solo. Mounting on Windows 7 and using the YouTube 1080 preset for export.
Someone at - it a problem with this and how to solve?

This looks like a problem of audio phase, see:

Re: audio missing on vimeo and youtube

Problems with my portafolio on mobile devices

Hello. I have problems, I just download my first project but images looks very bad when displayed on mobile devices. I tried looking for answers, but I couldn't find the reason. This is what it looks like on my laptop and an ipad. Thanks in advance

Hello

I'm sorry for the confusion! The width of the maximum image supported on Behance is 600px wide. Occasionally, you can see the projects that seem to have larger images. It is a 'hack', that some members have created by uploading a background image that seems to blend in the edges of the content wide 600px.

We invite you to do the same thing on your own projects, but is not taken use supported background images and we can not guarantee that future changes to our editor in Chief of project do not cause a conflict with this unorthodox use case. Currently, these projects are not supported on mobile devices due to limitations of iOS background, so we do not recommend using background images in this way.

I hope this helps clarify.

Problems of synchronization between a mobile device and Windows Mail

I use Windows Mail 6.0.6000.16386 version (vista_rtm.061101 - 2205) on my Vista machine.

T1) when I synchronize my contact numbers of my mobile (Nokia) to my Windows Mail Contacts using the supplied software (Nokia PC suite), I find that if a certain person/entity contact stored in mobile, to say Mr. X or Company Y, 4 phone numbers, only 1 or 2 of them get copied into the Windows Mail contacts folder other numbers not copied anywhere. What is the reason for this, and how can it be rectified it IE. all the associated with a given contact phone numbers must be copied across everything by synchronizing?

Q2) I have 2 mobile, each for himself, and wife. Each mobile has its own set of contacts. During synchronization with Windows Mail, I found that all the contacts from mobile 2 copied in a single database of Contacts in Windows Mail and vice versa so in each mobile. So my contacts appear in the motive of my wife, as well as its own contacts, contacts appear in my mobile, as well as mine. Is it possible in Windows Mail by which we create separate databases for each set of contacts in the mobile phone, so that when you run a synchronization between my phone and Windows Mail, only my contacts updated in 'ma' database and in my phone, then when the mobile synchronization of my wife with Windows Mail and only its contacts updated in 'his' database and his mobile phone.

Thank you very much!

Hello

I think many other users of Nokia's reported problems with this PC Suite software. I suggest you look on the Nokia forums for support with this specific software, as it is a question of Nokia PC Suite and not a Windows Mail or Windows issue.

As for your second question, you need to create a second account using Windows Mail and helps to keep the boxes to the letters and separate records:

http://answers.Microsoft.com/en-us/Windows/Forum/windows_vista-windows_programs/how-do-i-create-separate-inboxes-in-Windows-Mail/c5a458af-7d8b-4def-a3f5-bd425a2c519e

What happened to e-mail identities?
http://Windows.Microsoft.com/en-us/Windows-Vista/what-happened-to-e-mail-identities

Drop down to mobile devices does not

Spry menus dropdown does not not on mobile devices. Elson But for some reason, if you tap on the SWF animation in the header, the drop down menu will then work with a tap. No idea how it works?

Adobe abandons Spry 2 years because he survived its usefulness. Spry score event has no effect on touch screen devices. You must switch to a better menu system.

Nancy O.

Spry menu bar: problems in IE and Firefox

Hello! This is my first time writing the forum. I tried to fix this site and I'm about to break! I found a lot of help just brwosing here in the past and I hope that somone can point me in the right direction.

I have validated successfully the site using the W3C CSS Validator thinking which might help, but no go. (In fact, everything what was spoil the vertical alignment of elements of menu in Safari, Chrome and other browsers in which the menu used to work properly). I tested on the latest version of Firefox for Mac and testing for IE using the Adobe browser lab.

Here's what happens:

The menu is completely useless in all versions of Internet Explorer.

In Firefox the menu seems to work fine except the menu under flash items then disappear a site navigation very frustrating.

Here is the site: http://oregapet.com/

And here's my sections

@charset "UTF-8";
ul.MenuBarHorizontal {
          margin: 0;
          list-style-type: none;
          font-size: 80%;
          cursor: default;
          width:auto;
          font-family: Verdana, Geneva, sans-serif;
           [disabled]font: 11px;


          padding-top: 4px;
          font-weight: bold;
          padding-bottom: 2em;
}
ul.MenuBarActive {
          z-index: 1000;
}
ul.MenuBarHorizontal li {
          margin: 0;
          font-size: 100%;
          position: relative;
          text-align: left;
          cursor: auto;
          width: auto;
          float: left;
          background-color: #AAA;
          color: #FFF;
          padding-top: 0.3em;
          padding-right: 3.5em;
          padding-bottom: 0.3em;
          padding-left: 1em;
          min-height: 22px;
}
ul.MenuBarHorizontal ul {
          margin: 0;
          list-style-type: none;
          font-size: 90%;
          z-index: 1020;
          cursor: default;
          width: 0px;
          position: absolute;
          left: -1000em;
}
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible {
          left: auto;
}
ul.MenuBarHorizontal ul li {
          width: 15em;
          margin-left: -12px;
           [disabled]color: #FFF;


}
ul.MenuBarHorizontal ul ul {
          position: absolute;
          margin: -5% 0 0 95%;
}
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible {
          left: auto;
          top: 0px;
}
ul.MenuBarHorizontal ul {
          border: 0;
}
ul.MenuBarHorizontal a {
          display: block;
          cursor: pointer;
          background-color: #AAA;
          padding: 0.3em 0 0 0;
          color: #FFF;
          text-decoration: none;
}
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus {
          background-color: #AAA;
          color: #FFF;
}
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible {
          background-color: #AAA;
          color: #FFF;
}
ul.MenuBarHorizontal a.MenuBarItemSubmenu {
          background-repeat: no-repeat;
          background-position: 95% 50%;
          padding-top: 10px;
}
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover {
          background-repeat: no-repeat;
          background-position: 95% 50%;
          text-decoration: none;
}
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover {
          background-repeat: no-repeat;
          background-position: 95% 50%;
}
ul.MenuBarHorizontal iframe {
          position: absolute;
          z-index: 1010;
           [disabled]opacity:0.1;


           [disabled]filter:alpha(opacity=1);
  For IE8 and earlier 
}
 @media screen, projection {
ul.MenuBarHorizontal li.MenuBarItemIE {
          display: inline;
          f\loat: left;
          background: #FFF;
}
}

Thank you very much!

GRAMPS! Thank you very much. I really, really appreciate your help. In addition to your suggestion I changed all other instances of z-index that relate to the menu bar. I put them all to 10000 (more than the z-index of 1002 on the fadeslideshow.js). Now it works like a charm and is no longer hides behind the fadeslideshow. Yay!

Thanks to Nancy O. for his suggestion as well. For anyone having problems woth Spry Menu bar in IE and Firefox especialy: The Spry Menu Bar 2.0 version works much better than the previous version.

Melody

Problem with the 2.0 (1.0) Spry menu bar re - CSS

Hello:
I'm having some trouble with a Spry (horizontal) 2.0 (1.0) menu bar I created. Initially, I thought the problem was in what concerns the problems of rendering on IE 6.0, but the problem seems to be more general than that, and I came to believe that this has to do with the CSS created by the browser Widget and changed once imported in the Web page. That's why I chose to post my question here rather than on the spry page.
I leaned on the tutorial provided by David Powers (Bayside.css) and in addition any other documentation regarding the Spry UI bar menu. The problem appeared as one of the 6 IE rendered page with a gap that is created when the menus appear, so push down the divs that appear below the page.
However, through a laborious process of trial and error, my problem now seems to be that when I export the CSS generated by the browser widget to an external style sheet (the style sheet General governing the whole of the site), he comes into conflict with other CSS styles for links etc. The end result is that all the padding, background colors, background images, and colors of text are lost. As long as the CSS is in the head that this does not happen.
My thought is that this must have to do with the problems of specificity, inheritance, etc.
The site is available at the following ADDRESS: http://www.aclco.org/testing/index.html. In its current form, all the CSS associated with the menu bar is located at the head of each page. (see CSS below).
My question is I can set up a separate style sheet for the menu bar horizontally and have these styles applied specifically (and only) in the menu bar my only alternative is to work through the rest of the General style sheet and the work by problems of specificity/inheritance - that may be the "best" practice , but it may create another 'cascading' [sic] problems elsewhere.
Advice or suggestions or directed readings (which would point to a solution) that could be offered would be greatly appreciated.
Steve Webster
The horizontal CSS governing the menu bar is as follows: (currently the following CSS is embedded in the web page's head)
< style type = "text/css" >
/ * - Start styles horizontal Spry Menu Widget 2.0 (1.0) menu bar-* /.

/ * BeginOAWidget_Instance_2141544: #MenuBar * /.
/ * Values for skinning a basic through presets menu. If the default settings are not sufficient, most count should be done in
These rules, except for the images used to down or to the right pointing arrows, located in the SpryMenuBasic.css file

They take the following classes of widget for layout of menu (located in a "Preset")
. MenuBar - applies to all menu bars - default is a horizontal bar, all submenus are vertical - level 2 subs and beyond are drop down to the right.
. MenuBarVertical - vertical main bar; All submenus are drop down to the right.

You can also pass in extra classnames to set your desired top-level menu bar layout. Normally, they are defined by using a predefined setting.
They apply only to the horizontal menu bars:
MenuBarLeftShrink - the menu bar will be horizontally "shrinkwrapped" be just big enough to hold his items and left-aligned
MenuBarRightShrink - as MenuBarLeftShrink, but right-aligned
MenuBarFixedLeft - set to a specified width defined in rule "." MenuBarFixedLeft', and left-aligned.
MenuBarFixedCentered - Fixed to a specified width defined in rule "." MenuBarFixedCentered',.
and centered in its parent container.
MenuBarFullwidth - expands to fill the width of the parent container.

In general, all the rules specified in this file are prefixed by #MenuBar so that they don't apply to instances of the widget inserted along
with the rules. This allows use of multiple MenuBarBasic widgets on the same page with different layouts. Due to limitations in IE6.
There are a few rules where this was not possible. These rules are so noted in the comments.

*/
{#MenuBar}
background-color: transparent;
do-family: Arial, Helvetica, without serif. / * Specify the fonts on the bar menu and submenu MenuItemContainer, so MenuItemContainer.
MenuItem and MenuItemLabel
at a given level all use the same definition for ems.
Note that this means that the size is also inherited from the submenus of the child,
so be careful when using other than relative sizes
100% on the fonts submenu. */
make-weight: normal;
font size: 17px;
make-style: normal;
padding: 0;

}
/ * ATTENTION: because ID + class selectors do not work correctly in IE6, but we want to restrict these rules to all this
instance of widget, we used the concatenated string classnames to our selectors for the type of layout of the menu bar
in this section. These have very low specificity, so be careful not to overstep accidentally. */
. MenuBar br {/ * using only a class, so there same specificity that the "."} MenuBarFixedCentered br' rule bleow * /.
display: none;
}
. {MenuBarLeftShrink}
float: left; / * shrink the content, but also to float the menu bar * /.
Width: auto;
}
. {MenuBarRightShrink}
float: right; / * shrink the content, but also to float the menu bar * /.
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 bar small objects - these actually apply to all items and get substituted for the submenus level 1st or successive * /.
#MenuBar. {MenuItemContainer}
padding: 0px 0px 0px 0px;
margin: 0;     / * Zero margin on the containers of items. The MenuItem is the active area of hover.
For most elements, we have padding top or bottom or border only on MenuItem
or a child so we keep all tiled submenu with elements.
Definition of this 0 avoids the "dead zones" to hover. */
}
#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 no none;
}
#MenuBar. {MenuItemLast}
border-style: none none no 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 of submenu items * /.
#MenuBar. Submenu. {}, MenuItem
do-family: Arial, Helvetica, without serif.
make-weight: bold;
font size: 15px;
make-style: normal;
background-color: #000088;
padding: 0px 2px 0px 0px;
border-width: 0px;
border color: #cccccc #cccccc #cccccc #cccccc.
/ * Border styles are replaced by first and last items * /.
border-style: solid solid no solid;
}
#MenuBar. Submenu. {MenuItemFirst}
border-style: none;
padding: 0px;
}
#MenuBar. Submenu. MenuItemFirst. {MenuItemLabel}
padding-top: 0px;
}
#MenuBar. Submenu. {MenuItemLast}
border-style: none none no 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, objects 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; / * expose this propeller 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;
}
/ * The submenu - first-level submenus properties * /.
#MenuBar. {SubMenuVisible}
background-color: transparent;
min-width: 0%; / * This prevents the menu being lean that the parent MenuItemContainer - but not available on ie6 nice to have * /.
border-style: none none no none;
}
#MenuBar.MenuBar. SubMenuVisible {/ * menu bar horizontally for only * /}
top: 100%;    / * 100% is at the bottom of menuItemContainer parent * /.
left: 0px; / * "left" may need tuning according to borders or padding applied to the bar MenuItemContainer or MenuItem,.
and your personal taste.
0px align left drop-down list with the content of the MenuItemContainer area. Assuming you keep the margins 0
on MenuItemContainer and on the parent MenuItem
menu bar, which in fact equals the sum of padding-left MenuItemContainer & MenuItem align
the drop-down menu to 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 the width of the parent MenuItemContainer - elements will avoid total collapse * /.
}
/ * The sous-menu--deuxieme submenu level properties and beyond - are visible to descendants. MenuLevel1 * /.
#MenuBar. MenuLevel1. {SubMenuVisible}
background-color: transparent;
min-width: 0px; / * Do not neeed to match the width of the parent MenuItemContainer - elements will avoid total collapse * /.
Top: 0px;    / * If you want, you can move this down a smidge to separate the top item "submenu s of menubar.
It is really necessary only for the submenu on the first point of MenuLevel1, or you can make it negative to make the submenu
vertically 'centered' about his call to * /.
left: 100%; / * If you want to move the submenu on the left to partially cover the point of his call, you can add a margin to the left with a
negative value to this rule. Alternatively, if you use the elements of fixed width, you can change this value on the left
to use px or ems to get the desired offset. */
}
/ * IE6 rules - you can remove these if you do not want to support IE6 * /.
/ * Note about several classes in IE6.
Some rules above use several class names to an element of selection, such as "hover" (MenuItemHover) and 'a a submenu' (MenuItemWithSubMenu).
* give the selector '. MenuItemWithSubMenu.MenuItemHover'.
* Unfortunately, IE6 does not support using mutiple classnames in a selector for an element. For a selector like '. foo.bar.baz', IE6 does not take into account
* all but the final classname (here, ".baz") and defines the specificity in consequence, with only one of these classs as significant. To work around this problem
* problem, we use the plugin in SpryMenuBarIEWorkaroundsPlugin.js to generate classnames for IE6, such as "MenuItemWithSubMenuHover".
* Given that many of these necessary, the plugin does not generate additional classes for modern browsers, and we use the copies of CSS2 style class
* syntax for that. Since IE6, both apply the rules where the
* It should not and gets the specificity wrong too, we have rules of order carefully, then misapplied rule in IE6 can be overridden.
* So we put first the multiple class rule. IE6 wrongly apply this rule. We follow this with the single class rule that it would be
* replace by mistake, by ensuring that the specificity of IE6 interpreted as is the same as the unique class selector, so the latter wins.
* We then create a copy of the rule of multiple class, adding a "." SpryIsIE6' in the context of the class and to ensure that the specificity
* the selector is high enough to beat the rule of single class in the case of "match of these two classes. We place the rule of IE6 at the end of the
* block of css styling to make it easy to remove if you want to drop support for IE6.
* 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 need of IE conditional comments to these rules.
*/
. SpryIsIE6 #MenuBar. MenuBarView. MenuItemWithSubMenuHover. MenuItemLabel / * selector IE6 * /}
background-color: transparent; / * expose this propeller separately * /.
color: #ffffff;
}
. SpryIsIE6 #MenuBar. MenuBarView. Submenu. MenuItemWithSubMenuHover. MenuItemLabel / * selector IE6 * /}
background-color: transparent; / * expose this propeller separately * /.
color: #ffffff;
}
. SpryIsIE6 #MenuBar. Submenu. Submenu / * selector IE6 * /}
left margin:-0px; / * Offset at least part of a version of 'double upholstery' bug IE6 'double margin "* /.
}

/ * EndOAWidget_Instance_2141544 * /.
/ * End Spry Menu Bar Widget 2.0 (1.0) Horizontal Menu Custom styles * /.

< / style >
The CSS for the site in general is reproduced below: (my belief is that it is a: link, a: visited, a: hover, a: active styles that may be in conflict).
@charset "utf-8";

{body
Police: 100% Verdana, Arial, Helvetica, without serif.
min-height: 0; / * this is necessary to overcome the "haslayout" bug found in Windows 7 in conjunction with IE8. For more information see: URL - http://reference.sitepoint.com/css/haslayout.html * /
margin: 0; / * It is advisable to zero, the margin and the filling of the body to hold element has a different default browser * /.
padding: 0;
text-align: center; / * This allows the centering of the container and overcomes an inherent bug in IE 5 * /.
Color: #000000;
list-style-image: none;
background-color: #FCFCFC;

}
H1, h2, h3, h4, h5, h6 {}
color: #000066;
}
a: link {}
color: #151A 96.
text-decoration: underline;
}
a: visited {}
text-decoration: underline;
color: #1B8DCD;
}
a: hover {}
text-decoration: none;
color: #F30A0A;
}
a: active {}
text-decoration: underline;
color: #151A 96.
}
#container {}
Width: 960px;
margin: 0 auto; / * margins (in conjunction with a width) auto Center the page * /.
text-align: left; / * This setting 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 filling is the alignment to the left of the items in the div that appear below. If an image is used in the #header instead of text, you can remove the padding. */

Width: 960px;
height: 332px;
background-image:
URL (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Header_960.png);
background-repeat: repeat no.;
}

#header h1 {}

margin-right: 0px; / * zero setting of the margin of the last element in the #header div tag will prevent the collapse of margin - inexplicable space between divs. If the div has a border around it, this isn't necessary, which also allows to avoid the collapse of margin * /.
padding: 0; / * padding instead of margin will allow you to keep the edges of the div element * /.
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; / on this div element right margin creates the column on the right side of the page - no matter how content div the sidebar1″ contains, the space of the columns will remain. You can remove this line if you want the #mainContent div text to fill the space of #sidebar1 when the content of #sidebar1 is complete. */
padding-left: 30px;
padding-right: 20px; / * Remember that the fill is space inside the box of div and margin is the space outside the div box * /.
Width: 600px;
float: left;
}

{.sidebar_right}
float: right; / * because this element is floating, it takes a width * /.
Width: 270px; / actual width of this div, in browsers comply with the standards, or the standard mode of Internet Explorer includes the padding and border in addition to width * /.
top of the margin: 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; / * because this element is floating, it takes a width * /.
Width: 270px; / actual width of this div, in browsers comply with the standards, or the standard mode of Internet Explorer includes the padding and border in addition to width * /.
top of the margin: 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 filling are fixed as follows to reflect the quirks in the rendering of the browser while ensuring that the text is contained in 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: #151A 96.
text-decoration: none;
make-weight: bold;

}

#issues_menu a: visited {}
color: #151A 96.
make-weight: bold;
text-decoration: none;
}
#issues_menu a: hover {}
color: #F30A0A;
make-weight: bold;
make-style: oblique;
text-decoration: none;

}
#issues_menu a: active {}
color: #151A 96.
make-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;
make-style: normal;
make-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 filling is the alignment to the left of the items in the div that appear above him. */
Width: 960px;
height: 222px;
background-image:
URL (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Footer%20_960.png);
background-repeat: repeat no.;

}
#footer p {}
margin: 0px; / * zero setting the margins of the first element in the footer will avoid the possibility of the collapse of the margin - a space between the div tags * /.
padding: 0px; / * padding on that element will create space, just as it would the margin, free margin collapse question * /.
text-align: center;
margin-left: 50px;
right margin: 50px;
padding: 10px;
font size: small;
}

#footer h5 {}
text-align: center;
}
.fltrt {/ * this class can be used to float right to the item in your page.} The floating element must precede the element it should be next to the page. */
float: right;
left margin: 8px;
}
.fltlft {/ * this class can be used to float an element on your page to the left * /}
float: left;
right margin: 8px;
}
.clearfloat {/ * this class must be placed on an element div or break and should be the last item before closing a container should completely contain a float * /}
Clear: both;
height: 0;
font size: 1px;
line-height: 0px;
}

{.dropcap}
display: block;
float: left;
line-height: 80%;
font size: 250%;
make-weight: bolder;
color: #000066;
Padding: .1em .03em 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;
do-family: Georgia, "Times New Roman", Times, serif;
make-style: italic;
Police-weight: 900;
}

{.attention_small}
color: #F30A0A;
font size: large;
do-family: Georgia, "Times New Roman", Times, serif;
make-style: italic;
Police-weight: 900;
}
.table {}
table-layout: fixed;

}
. Blue {}
Color: #00F;
}
#container .mainContent_left p .blue {}
color: #0303A 0;
}

Hello Steve

Well, I checked your page in IE6 and it seems to work fine for me except that here seemes to be a little space between
items that may be due to lack of support of .png? In other words, if there is a little transparency on the edge of the chart? Maybe it's more a shot in the water on my part!

Now my suggestion to you would be to mark this thread as closed/replied and after again with just the link to the page and your question. Short is sweet.

Martin

Background of the Spry menu bar problem
Hello
I tried to search for this problem, and although I found others with the same problem, there has been no response (probably so obvious I missed it and they understood.) And I update the Spry menu bar to the latest version.

The Horizontal Spry menu bar works fine on Firefox and IE 7, the background is white and the submenus, not the intention. Alignment and size is fine, just designed background colors do not work (on the menu itself, I want a transparent background on submenus, #777079.)
Website: September Entertainment Site
Style sheet Spry: Spry CSS

Thank you in advance for any help you can give me.
See you soon,.
Janell
Hello
Just found the problem for someone who is having the same thing happen. This is the cut down "Sections":

/*******************************************************************************

BROWSER HACKS: hacks below should not be changed, unless you are an expert

*******************************************************************************/

/ * HACK FOR IE: to ensure that sub menus show above form controls, underpin us each submenu with an iframe * /.
UL. MenuBarHorizontal iframe
{
position: absolute;
z index: 1010;
Filter:alpha(opacity:0.1);
}
/ * HACK FOR IE: to stabilize the appearance of the menu items. the slash in the float is to keep IE 5.0 analysis * /.
@media screen, projection
{
UL. MenuBarHorizontal li. MenuBarItemIE
{
display: inline;
f\loat: left;
background: fff;
}
}

Where it says: "background: fff;" change to everything that you need, in my case, "background: transparent;"

Voila!
See you soon,.
Janell

Another problem of Spry Menu/Internet Explorer
Firefox and Safari display very well my spry menu. Not the same with Internet Explorer.
Any suggestions? USCHT
Hello

I'm afraid that's not so much a question of spry.
The spry CSS has been published and there is lack of a few things like having
some things in the wrong place now.
There are errors in your CSS.
There is a problem with your HTML code allowing the problem IE the area in full expansion.
In addition, to increase the size of the text in FireFox (ctrl + +) and you will see the page
breaks apart.

Here's the code broken in your sections
(Notice the comment ended up between the class and the support and the a tag
... missing a cut and paste error?) :

UL. MenuBarHorizontal / * Menu items are a light grey block with padding and
no text decoration * /.
UL
{
display: block;
cursor: pointer;
background-color: #431F45;
Padding: 0.5em 0.5em;
text-decoration: none;
}

Go back to the way it was originally and then change the colors in your
so, it looks like this:

/ * Menu items are a light grey block with padding and no text decoration * /.
UL. MenuBarHorizontal a
{
display: block;
cursor: pointer;
background-color: #431F45;
Padding: 0.5em 0.75em;
text-decoration: none;
}

Then, change this:
UL. MenuBarHorizontal ul. MenuBarSubmenuVisible
{
left: auto;
}

Return to:

UL. MenuBarHorizontal ul. MenuBarSubmenuVisible
{
left: auto;
top: 0;
}

Then note how comments say fixed-width, but auto has been used.
Implement than the back:

/ * Container of menu items are same fixed width parent * /.
UL. MenuBarHorizontal ul li {}
Width: 8.2em;
}

Then get rid of self again by changing this line:

/ * Submenus should appear under their parent (top: 0) with a higher z-index,
but they are first the left side of the screen (-1000em) * /.
UL. MenuBarHorizontal ul {}
margin: 0;
padding: 0;
list-style-type: none;
do-size: 100%;
z index: 1020;
cursor: default;
Width: 8.2em;
position: absolute;
left:-1000em;
}

And get rid of the car, once more, by changing this back to:

/ * Menu item containers, children of the position relative to this container and
are a fixed width * /.
UL. MenuBarHorizontal li {}
margin: 0;
padding: 0;
list-style-type: none;
do-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
Width: 8th;
float: left;
}

Note also the font sizes are changed to 100% on the bar menu li and
submenu li...
You already reduce the police to 80% in the main AMT, so using 80% again on
the elements within the AMT, you essentially said 80% of 80%.
Who was the tilt things in Internet Explorer. I think it's hard to keep track, but it
appears to set the offset drop down lists.

Now, in your CSS change the body and this envelope:

{body
background-color: #FFFFFF;
do-family: "Times New Roman", Times, serif;
padding: 0;
margin: 0;
text-align: center;
}
{#wrapper}
margin: 0px auto;
padding: 0;
background-color: #000000;
Width: 800px;
text-align: left;
}

Moreover, now you can remove all the font family: "Times New Roman"
Times, serif; throughout your CSS as they will all inherit it body.

Then, in your CSS, solve this problem by removing the float or giving him a
direction. :

#footer {}
float:
Width: 800px;

Then, change this:
{p}
do-family: "Times New Roman", Times, serif;
color: #FFFFFF;
do-size: 14px;
text-align: left;
left margin: 7px;
right margin: 2px;
}

to do this:

{p}
color: #FFFFFF;
do-size: 14px;
margin: 2px 2px 7px;
}

Then, in your code, get rid you of all between them the words in the spry
menu, such as here:
Who are we

There is more that I have seen.
Once they are gone, you will have the expanding box problem in Internet Explorer.

Now get an overview of the page.
The menu can be a bit off but which is caused by the amount of text that you are
try to fit in this field.
"You can give the different li single width, so that you can make: home ' not as
wide and then do the '2005 USCHT objectives. "
Tourism Summit"a large button and so immediately (or simply change of objectives).
You can make the smallest font size (only not by changing size % in the submenus)
but by changing the font size in the main AMT)
Or, you can re - thinking the layout of link.

Take care
Tim

"BeausMom" wrote in message
News:ft3fra$16J$1@forums. Macromedia.com...
> Firefox and Safari display very well my spry menu. Not so with Internet
> Explore.
> Any suggestions? http://www.uscht.com

How can I make the menu vertical spry clickable CS6 for mobile devices?

It works very well for the PC, but on mobile devices you must press a link, then the other. Then go back and click on the first link to get the secondary menu appear or work. I know he's a scoring event in the JS file, but don't see anything that could trigger an event click or tap. I'd love it if someone could point me in the right direction, because I'm doing my old site more mobile friendly.

Spry is dead. Adobe abandons Spry in 2012. Nobody uses it more because it's not touch friendly. Find a better system of menu - jQuery & CSS.

Nancy O.

Spry menu bar and Style sheets

Dreamweaver CS6:

I insert a Spry menu bar in a .dwt file model.
.dwt file seems functional in Live View mode and the Spry menu bar behaves as expected.   I save the .dwt file and then create a new .dwt file .html page.
The new .html page appears in Design view, but when I switch to Live View there is no visible style. Content is present, but it is as if the stylesheet has been turned off.   Both the general style of the page and the Spry menu bar are missing. Even when the page is downloaded.
The general page style sheet is in the folder of css and Spry worksheet menu bar is located in the SpryAssets folder.   The references in the page coding for style sheets look correct.
Advice appreciated please.

Ok. In your model, change this:

Index<p class="reply"> <p class="reply">to do this:</p> <p class="reply"></p> <p class="reply"><title>Index

And this:

to all this:

Save the model. Now try to generate a new page of the child.

Nancy O.

Spry menu bar problem

Hi all, new here and also a new Adobe product user. I'm learning Dreamweaver at the present time and it is excellent if a little discouraging sometimes.
I need some help with a problem of Spry. When I insert a new Spry menu on my page in Dreamweaver, the submenus don't drop-down for me. For example - if there are 3 elements of submenu 1.1, 1.2 and 1.3, when I click on the arrow, I don't see the point 1.3... 1.1 and 1.2 seem to be obscured view?
I have attached a small image to show you what it looks like. Any help would be greatly appreciated as it continues my little project something terrible
Thank you guys
Pol

If you customize, make sure not to remove anything vital or you will break it.

READ THIS FIRST:

Menus Spry 10 commandments

http://www.dwcourse.com/Dreamweaver/ten-commandments-Spry-menubars.php

Nancy O.

THE problem with Horizontal Spry Menu

I use a horizontal Spry menu on my new Web site of the office. In IE9, but on the subpage of the site, the submenu display strangely, fill a horizontal space rather than descend vertically. It works on the index page, and it seems to me that the divs and other circumstances are the same in each file. Any advice or assistance would be appreciated.
An example of the arrangement of the subpage: http://test.faculty.umd.edu/teach/syllabus_ie.html Hovering above the menu should show the problem.
The index page (showing how the menu works correctly): http://test.faculty.umd.edu/index_ie.html
Thank you
Rebecca

The Spry menu that is built into Dreamweaver using older code that is not compatible with IE 9. If you want to use a Spry menu, you need to use Spry Menu 2.0, you can install using the browser Widget from Adobe. See http://www.adobe.com/devnet/dreamweaver/articles/spry_menu_bar.html.

On the other hand, you might be better off looking for a different menu. There has been a lot of problems with Spry, and the framework has not been updated for several years.

Spry Menu problem: no menu style on mobile devices

Similar Questions

Maybe you are looking for