Applying widgets

When you use widgets obtained with Adobe widget browser in Dreamweaver CS5 the widgets do not work properly right away because the files are still where widget browser keeps them and not the local site folder (which means relative links to things do not work).
Dreamweaver can relocate these to the local folder to make it work properly
What is this process called and how do you it?
(i dont yet have a host so having DW do it automatically before uploading the site wont work!)

i have fixed the problem now
i was trying to use a google maps widget
for some reason i had to remove the 2 lines of text dream weaver inserts above the <head> tag before it would work
same problem occurred when i tried to get the code directly from Google
not sure why thoes lines break the google code thou

Similar Messages

Error when adding Spry Tooltip to page with footer library

I'm using Dreamweaver CS4 and the Spry menu to apply widgets.
I was able to create a brand new page, import an image, and apply the Spry Tooltip widget successfully (as well as edit the CSS etc.).
But I run into problems when I applied it to an image on my real page, which is pretty busy, and in columns etc. I select the same image and apply the Spry Tooltip. I get this error message:
"Making this change would require changing code that is locked by a template or a translator. The change will be discarded."
Searching online, it seemed to have something to do with a region that is not editable, like a template or library item. I'm not using Templates, but I did have a few library items. The Library for my footer, which included the script for Google Analytics, was what was causing the problems.
It seems what Tooltip was trying to do was insert its script INSIDE the existing script in the Footer library - which is not editable. I needed to remove the Footer Library, apply the tooltip, then re-insert the Footer Library. This is how it needed to flow:
</div>

<div id="footer">
<p>footer copy here</p>
</div>
<script type="text/javascript">
blah blah google analytics stuff...
</script>

<div class="tooltipContent" id="sprytooltip1">Tooltip content here.</div>
<script type="text/javascript">

</script>
</body>
</html>
I think if the footer library didn't have a script in it, it would not have been an issue. It's just that the </script> was right before the </body> and it figured it could just insert the Spry code there.
I wasted an hour troubleshooting this - I wish Dreamweaver was smarter when it inserted widgets and would know where Library items started and stopped.

Select your external drive in finder.
press CMD and i
an info windows will open - what is reported as "Format" ?
anyway scroll down to the very bottom: "Sharing & Permissions"
set everyone's privilege to "Read & Write" and choose to "Apply to all enclosed items"

Training gets stuck before quiz screen - place of stuck depends on module completion sequence

Hi everyone!
Please take a look at below description of the problem and I really hope that you will be able to help me out or at least give some ideas to check.
1. Issue case:
One of the modules cannot be completed as it get stuck on slide before quiz (the blockade occurs always occurs on such slide).
2. Issue lead-in:
Using Captivate 6;
Published in SCORM 1.2;
Training consist of 6 modules;
Modules 1;2;5 contain quiz slides;
Sequence of completing the modules is free.
3. Issue chronology:
Issue first encountered by client, where he got stuck on module 5 on slide before quiz during completing modules in sequence: 1;2;3;4;5;6;
We've generated the problem as well in the same sequence;
We've came up with the idea of placing the 'Next' button on slide before quiz in module 5 so the client would have tool to force the jump to the quiz;
We've tested the 'Next' button and from till that moment our side cannot generate the problem - as you surely guess - our client despite the 'Next' button still cannot proceed to the quiz - the button simply does not work for him;
During testing we've also found out that the sequence also matters - as said in point 2.4, the quizzes are configured in module 1;2 and 5 - client went through training from the end to the beginning (6;5;4;3;2;1) - the module 5 was completed without problem, but he got stuck on module 1 on slide before quiz ('Next' does not work).
4. Tests run and results:
configured 'Next' button in modules 1;2 and 5 on slides before quizzes
          result: provider till that moment provider cannot generate the stuck, client still gets stuck;
client went through the training in diffrent sequences - sequence came up to have influence
          result: some parameter gets 'filled up' and does not want to let client to move forward
Sequence 1 (1;2;3;4;5;6) - got stuck on module 5;
Sequence 2 (6;5;4;3;2;1) - got stuck on module 1.
as the client works on highly secured network - we've asked him to test the training via external internet connection - unfortunately, the stuck still occured using sequence 1
          result: the problem is not hidden within the internet connection;
applied widget and withdraw 'Next' button (http://captivatedev.com/2012/09/26/adobe-captivate-6-0-free-widget-time-based-actions/) with hope that it will force the training in sequence 1 to jump to quizzes - internal testing showed that stuck problem still exists
          result: the widget does not solve our problem;
organised 'work around' as evading solution: after completing 3 modules, user will exit the training, then re-enter and continue with other modules without problem - assumption was to clear the 'filled up' parameter
          result: client completed 3 modules, exit the training, even reset the computer, re-entered the training and the stuck still occured
5. Sum up:
The training stucks always on slide before quiz.
The place of stuck (module 5 or module 1) depends on sequence - suspect that some parameter 'fills up' and starts to block.
The problem results in denying the completion of one of the modules - user won't be able to complete the training.
PLEASE HELP!

Dear Anjaneai,
Thank You for your reply.
Due to extending the info about the training:
1)   Module 1 - 2 questions;
      Module 2 - 1 question;
      Module 5 - 1 question.
That gives offcourse total number of 4 questions through out the complete training.
The project contains 81 slides.
The source file of the project has 76Mb.
2) Please find below the report for advanced interactions.
I hope that the picture is readable ans will give you the needed info.
TESTING feedback
We will perform the test.
For now I wanted you to get info update to maybe come out with new trace.
Captivate version
6.1.0.319 - so your condition is met.
Please let me know if given data managed to discover any new trace to follow.

Menu Widget is not working correctly when applied in Master Page?

Hi There,
Is there a reason why menu widget doesn't work correctly when put in the master page? When I do preview it only highlights certain menu and doesn't highlight other ones? In order to fix this I had to take my menu widget off the master page and had to manually apply the menu widget on each page for it to work correctly? Is there a reason why this is happening and are you guys working on fixing this?
Best Regards,
Nick

Hi There,
Just published the northcountydoulas website through business catalyst that
wasn't working correctly...The menu widget is in the master page...
Best Regards,
Nick

How to apply sliding panels Spry Widget in Dreamwevaer CS4

Could someone please share how to apply sliding panels widget in Dreamwevaer CS4 as it is not in insert spry panel?
Thanks kindly!

Hi Brad,
I meant something like this:
http://labs.adobe.com/technologies/spry/samples/slidingpanels/SlidingPanelsSample2.html
http://labs.adobe.com/technologies/spry/samples/slidingpanels/SlidingPanelsFromData.html
or the one used on their site:
http://labs.adobe.com/technologies/spry/home.html
Thanks kindly

Feature Search Widget; Feature Request - Quick Apply

Hi
Is there a posibility to change the the implementation of the
FeatureSearch Widget? By now you enter your search string e.g.
gaussian and after that you have to use the mouse to select the
right item.
I want to see the search feature work like the quick apply
tool in InDesign. Just hit cmd+enter, write the (menu)command you
want to apply and select the one you want with the cursor keys on
the keyboard. After that just hit the enter key and the world is
fine!
So, please put a feature like
quick apply in Photoshop. Just in the commandbar left
adjacent the workspace selector!

Yes, this is good idea.

Apply Instant Alpha after placing an image in the pop-over widget?

How can I apply Instant Alpha to an image after placing it in the pop-over widget? Because, if I first apply Instant Alpha IBA does not allow me to place it in the widget.

It does if you copy and paste instead of trying to drag it in from the page.

IBooks Author: How do you get the inset margins applied to the caption text of gallery widgets to preview correctly on an iPad?

Currently the inset margins I set for caption text in the gallery widget resets to zero when previewed on different iPads. These are galleries with different images and the captions are set to “individual caption per image” in the interaction panel.
BUT the inset margins will preview correctly if the gallery caption is set to “same caption for all images” in the widget interactions panel. How does one go about fixing this in iBooks Author? Would love to hear others advice or suggestions or work arounds. Thanks!

I found this article that shows the folder we are looking for is here --
~/Library/Containers/com.apple.iBooksX/Data/Documents/AEAnnotation/
per http://mjtsai.com/blog/2013/11/06/the-problem-with-ibooks/ and http://computers.tutsplus.com/tutorials/beyond-highlighting-how-to-get-the-most- from-your-annotations--cms-20013
So I opened the files in TextWrangler to search for a word I know I highlighted in a particular book. That helped me identify the correct file for the book I am concerned with. I did a Time Machine restore of the file and got my notes back the way they were.

IBooks Author: How do you get the inset margins applied to the caption text of gallery widgets to preview correctly?

Currently the inset margins I set for caption text in the gallery widget reset to zero when previewed on different iPads. These galleries have multiple images and the captions are set to "individual caption per image" on the widget interaction panel. BUT the inset margins preview correctly if the gallery caption is set to "same caption for all images" in the gallery widget interaction panel. How does one fix this in iBooks Author? Would appreciate any advice or work arounds or suggestions.
Thanks!

The arrows don't show up on the iPad, they are only to aid navigation within iBA. You can use boxes in the background to frame your galleries (as the background is off). I believe it's also possible to change the colour of the dots beneath the gallery too, although I forget how to do that right now.
About Apple's rigid UX – I agree that it can be frustrating. Apple intended iBA to be used by everyone, and the sort of design options and customisability we might want may confuse the less experienced user. Apple also wanted the UI for every book to be the same – from the point of view of the new user, once you've used one iBA ebook (or iBook, I'm not sure what Apple want us to call it), you can use them all. Otherwise end users would to get used to a slightly different UI on each book, which kind of works against the idea that ideally UI should be intuitive enough to be invisible. I can see the point in that. I have created a 'How to use' section in every iBA file I've made. It get's old quickly.
Oh, and (you probably know this, but…) you can choose your own custom icon for audio. It's limited, as it's only a placeholder image that allows you to play an audio file, there's no ability to pause the audio or stop it once you choose the view as thumbnail choice. Something I'd like to see changed.
Here's a link to Apple feedback page for iBA. Feel free to hammer it with your suggestions.
https://www.apple.com/feedback/ibooks-author.html

Spry Menu Bar Widget 2.0 (1.0) -- IE 6 Rendering Snag

Hi:
Once again I need to call on the aid of others with more detailed knowledge of the spry frameworks, particularly the Spry Menu Widget 2.0 (vers. 1.0) developed by Adobe labs.
I have posted the site to http://www.aclco.org/testing/index.html. You will see that it works beautifully, thanks to the help of many contributors, except in IE 6.0, where, when the sub menus become visible and drop down, it causes all page elements (divs) to be pushed down to create the necessary room to accommodate the drop down. The natural overlap of the sub-menu over pre-existing content doesn't seem to overlay properly.
It does this on all pages, and not just those which present flash sideshows. And as I say it is peculiar to IE 6.
I have followed the tutorial provided by David Powers in deploying the widget and have not altered the spry skin css or the basic css. Any changes (affecting padding, etc. and adding of background images where created using the widget browser and supplemented in the css added to the template page. The "add-on" css was then added to the general style sheet governing the whole site layout.
I was wondering if anyone else has experienced this problem, if there are any work arounds or hacks that anyone is aware of, or any other suggestions that might help.
I haven't been able to preview this on a free standing PC using IE6, but was able to reproduce the problem on 2 cross browser testing services employing a "live mode". I renders properly until the sub-menus are called upon to become visible, and then the problem manifests.
Your assistance will be greatly appreciated.
Sincerely,
Steve Webster
Attach.
Please note: Attached are the relevant excerpts from the customized style sheet as amended from the spry widget browser:
/* -- 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%20Segme nt-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: solid solid solid solid;
#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%20Segme nt%20Light2.png);
background-repeat:repeat-x;
border-color: #cccccc #cccccc #cccccc #cccccc;
#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;
border-color: #cccccc #cccccc #cccccc #cccccc;
#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-color: #ffffff #ffffff #ffffff #ffffff;
border-width:0px;
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 */

I have systematically reviewed the tutorial of David Powers on the Spry Menu bar 2.0, and recreated the process in a methodical process - making one change at a time, and then checking each step on a cross browser testing server, and have found, quite to my amazement that what seems to be causing the problem of the "gap" in IE 6 is by removing the customized styles from the head of the individual pages, and placing them in CSS stylesheet that governs the entire site.
I find this quite inexplicable. When the customized CSS rules governing the menu bar are situated in a separate stylesheet, the page renders well enough for any of the "modern" browsers, but won't render in IE 6. All that I get is a horizontal menu with drop downs, but none of the styling (specifically background colours, background images, etc.) that are called for in the stylesheet and that otherwise appear when rendered by other browsers.
I realize that this sounds strange, but I was wondering if anyone had experienced this phenomenon, or could offer any explanation.
Any suggestions would be greatly appreciated.
Steve Webster

Spry Menu Bar 2.0 (1.0) - Handling of widget generated CSS, placement and rendering problems in CSS

Hello:
I wanted to repost my question to re-frame the issue based on what I have learned thus far.
I am working on a website that has been developed using the Spry Menu Bar Framework UI (2.0) I.0, that has some peculiar rendering problems that affect IE 6 in particular. The CSS is reprinted below.
In particular, when I post the widget generated CSS in the head as it is orginally situated by the framework, the menu bar works fine. However, it seemed to me that I should be able to reduce page weight (an important consideration considering my target population) by placing it in the general style sheet governing the entire site.
When I place the styles at the beginning of the style sheet the menu doesn't render at all in any of the browsers (IE 6+, Firefox, Opera, Safari, Netscape, etc.) as it conflicts with the general rules governing links that appear later in the style sheet. When I place the styles specific to the Menu bar at the end of the style sheet, then the menu bar renders properly in all browsers except IE 6.
The odd thing is that the only way to ensure that the menu bar works in IE 6 is to keep the menu related styles in the head of each page. This raises problems related to page weight (not an insurmountable consideration if no other solution can be found) but still an issue. Likewise I need to support IE 6, again given the target audience/population. The issue obviously has something to do with specificity, but I am not certain that is the only consideration at work here. I have not tried the !important selector in regard to the menu, as IE 6 seems to only partially support this.
Thanks in advance for any advice or insight that can be provided. Thanks in particular to Martin for his contributions to my earlier question related to this issue.
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 rightpointing 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, allsubmenus 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 levelmenu 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 onthe 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 onMenuBar 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/Nav igation%20Bar%20Segment-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/Nav igation%20Bar%20Segment%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 theparent 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 theMenuItemContainer. 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 forselection, such as "hover" (MenuItemHover) and "has a subMenu"(MenuItemWithSubMenu),
* giving the selector '.MenuItemWithSubMenu.MenuItemHover'.
* Unfortunately IE6 does not support using mutiple classnames in aselector for an element. For a selector such as '.foo.bar.baz', IE6ignores
* all but the final classname (here, '.baz'), and sets thespecificity accordingly, counting just one of those classs assignificant. 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 lotof these needed, the plugin does not generate the extra classes formodern 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.jsscript.
* The 'SpryIsIE6' class is placed on the HTML element by the script in SpryMenuBarIEWorkaroundsPlugin.js if the browser isInternet Explorer 6. This avoids the necessity of IE conditionalcomments 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" bugthat is found in Windows 7 in conjuction with IE8. For Moreinformation 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 elementsin the divs that appear beneath it. If an image is used in the #headerinstead 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 columndown the right side of the page - no matter how much content thesidebar1 div contains, the column space will remain. You can removethis 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/Por trait%20Textbox%20Header.png);
.sidebar_textbox_background_middle {
     width: 255px;
    padding-top: 12px;
    padding-bottom: 10px;
    background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Por trait%20Textbox%20Middle.png);
    background-repeat: repeat-y;
.sidebar_textbox_content {
   /* The width and padding are set as follows to accomodate quirks inbrowser rendering and to ensure that text is contained within thebackground 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/Port rait%20Textbox%20Footer.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%2 0Header.png);
.landscape_textbox_middle {
    width:auto;
    margin:auto;
    padding-top: 12px;
    padding-bottom: 12px;
    background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/lan dscapte%20Textbox%20Middle.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/Lan dscape%20Textbox%20Footer.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 footerwill 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%20Fu ll.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;

Hi Nancy:
The specific code that I am referring to is the CSS code governing the styling of the spry menu widget that only works in IE 6 if, and only if, it remains in the head of the web page. If removed and placed in a stylesheet, the IE plugins fail to compensate for the IE 6 "gap" bug. As I said, it doesn't make sense to me that, assuming specificity is addressed, that these can not be included in an external style sheet. I am looking for a) an explanation why they must remain embedded in the web page; and 2) any means by which I might be able to export them.
I will reproduce the specific css style (code) below: it should also be visable through reveal source --
Thanks again, 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 rightpointing 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, allsubmenus 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 levelmenu 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 onthe 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 onMenuBar 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/Nav igation%20Bar%20Segment-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/Nav igation%20Bar%20Segment%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 theparent 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 theMenuItemContainer. 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 forselection, such as "hover" (MenuItemHover) and "has a subMenu"(MenuItemWithSubMenu),
* giving the selector '.MenuItemWithSubMenu.MenuItemHover'.
* Unfortunately IE6 does not support using mutiple classnames in aselector for an element. For a selector such as '.foo.bar.baz', IE6ignores
* all but the final classname (here, '.baz'), and sets thespecificity accordingly, counting just one of those classs assignificant. 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 lotof these needed, the plugin does not generate the extra classes formodern 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.jsscript.
* The 'SpryIsIE6' class is placed on the HTML element by the script in SpryMenuBarIEWorkaroundsPlugin.js if the browser isInternet Explorer 6. This avoids the necessity of IE conditionalcomments 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>

Template ID's won't apply

I have a template with a text box for the main body text. This text box has an ID which puts in a scroll bar when the text goes beyond the height of the box. When I use the template for a new page this ID will not apply. The text simply goes on and on down the page and moves the photo on the right of it to the middle of my page.
Here is the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Tour Guide Training Corporation</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" />
<style type="text/css">

</style>


</head>
<body>
<table width="990" border="0" align="center" cellpadding="2" cellspacing="1">
<tr>
    <td width="286"><img src="Images/Logo.gif" width="288" height="122" alt="logo" /></td>
    <td width="693" class="rightheadertext"><p>416.737.0616</p>
    <p>[email protected]</p>
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a class="MenuBarItemSubmenu" href="#">Become a Tour Guide</a>
        <ul>
          <li><a href="#">Travel Course Outline</a></li>
          <li><a href="#">Prices & Dates</a></li>
          <li><a href="#">Facilities & Accomodation</a></li>
          <li><a href="#">Travel Training Policies</a></li>
          <li><a href="#">Tour Guide Questions</a></li>
          <li><a href="#">Career Change Placement</a></li>
          <li><a href="#"> Process & Policies</a></li>
          <li><a href="#">Online Travel Training</a></li>
</ul>
      </li>
      <li><a href="#" class="MenuBarItemSubmenu">Tour Managers</a>
        <ul>
<li><a href="#">Guide Workshops</a></li>
<li><a href="#">Tour Commentary</a></li>
<li><a href="#">Coach Entertainment</a></li>
<li><a href="#">Tour Guide Tools</a></li>
        </ul>
      </li>
      <li><a class="MenuBarItemSubmenu" href="#">Tour Operators</a>
        <ul>
<li><a href="#">Corporate Workshops</a></li>
<li><a href="#">Our Guides</a></li>
<li><a href="#">Canadian Local Lisencing</a></li>
        </ul>
      </li>
      <li><a href="#" class="MenuBarItemSubmenu">News & Events</a>
        <ul>
          <li><a href="#">Trips</a></li>
          <li><a href="#">Local Travel News</a></li>
          <li><a href="#">Global Travel News</a></li>
        </ul>
      </li>
    </ul></td>
</tr>
</table>
<table width="990" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
    <td width="457"><div id="mainbody">
      <p><span id="title">TOUR GUIDE ANWERS</span><span id="spacer">......</span>/def. response to a question</p>
      
      <ol start="1" type="1">
        <li><strong>What       is the difference between Tour Manager, Director, Guide, leader?</strong></li>
      </ol>
      <p>There are many different terms for someone who leads a group. Typically if you are working locally you are a “guide”, over the road on a coach is a “director” or “manager” and overseas work is a “leader”. </p>
      <ol start="2" type="1">
        <li><strong>What       does a Tour Guide/Director/Manager do?</strong></li>
      </ol>
      <p>A Tour Guide answers all the questions that a tourist comes up with – from the history of the area to what time breakfast is served at the hotel. They are also expected to provide commentary on the area that the tour travels through, reconfirm every meal, boat cruise, hotel stay and activity that the group does. Aside from this, they may play the role of host, psychologist, parent, nurse and teacher<strong>.</strong></p>
      <ol start="3" type="1">
        <li><strong>I       want to lead tours overseas; must I have visited the country before?</strong></li>
      </ol>
      <p>No, when traveling overseas you will be assisted by local guides who know the area well. When overseas your job is to liaise between the passengers and the local tour operator. TGT prepares you to work anywhere in the world. </p>
      <ol start="4" type="1">
        <li><strong>Do       I need to speak a second language?</strong></li>
      </ol>
      <p>No. There are enough English-speaking tourists around the world to keep you employed. The ability to speak a foreign language is an asset but not a necessity.</p>
      <ol start="5" type="1">
        <li><strong>How       much free time will I have on when leading tours?</strong></li>
      </ol>
      <p>Tour days vary in length. Some days are long with quite a few hours spent driving, others are short with free time provided for the passengers to shop or sightsee on their own. If the passengers are free so is the guide. Typically while conducting an 8-day tour you will have a few nights, and an afternoon or morning free. It is important to remember, however, that you are working and always on call.</p>
      <ol start="6" type="1">
        <li><strong>How often is a Tour Director away       on a trip?</strong></li>
      </ol>
      <p>A Tour Director can choose to work part-time or full-time. Most trips are 4 – 16 days long but there are exceptions to this rule. This means in the summer they conduct several tours then take the winter off, or they may work in warmer climes during the winter. How much time spent away on trips is really up to the individual.</p>
      <ol start="7" type="1">
        <li><strong>How       much money does a you make?</strong></li>
      </ol>
      <p>Guides are paid in three ways. On an 8-day tour with 40 passengers, pay could range from $2,000 to $3,000. Salary is usually around $100 per day, commissions can vary from $25 - $100 per day and gratuities might be $1,400 for the duration.</p>
      <ol start="8" type="1">
        <li><strong>Why       take the TGT certification?</strong></li>
      </ol>
      <p>Ongoing professional development is vital to any career. The Tour Guide answers to everyone in the field. We prepare you to be an efficient guide and put you a step ahead of your peers. The cost of the course can easily be recovered in just one tour; a small price to pay for the ongoing support that TGT provides. We assist you in finding employment, creating the perfect tour and working with your employer. Here is a list of some of the companies that have hired TGT graduates: Australia Pacific Touring, Great Canadian Coach, Contiki, EF Smithsonian, Jonview Canada Inc, Globus, Cosmos Tourama, and Trafalgar Tours. </p>
      <ol start="9" type="1">
        <li><strong>May       I come on a training tour (to observe)?</strong></li>
      </ol>
      <p>Yes, please do! You may come to a class or join us on one of our training tours with our Travel Leaders showing you the way. For detailed information on please Contact Us.</p>
      <ol start="10" type="1">
        <li><strong>Does       it matter where I live?</strong></li>
      </ol>
      <p>Typically, your employer will pay your travel from your home to the starting point of your tour and back so, it does not matter where you live. If you live close to an international airport, this allows you a greater opportunity to choose whom you work for.</p>
      <ol start="11" type="1">
        <li><strong>May       I speak with one of your graduates?</strong></li>
      </ol>
      <p>Yes! They would be happy to share their experience with you. Please send us your course registration and we will have someone contact you with all the tour guide answers.</p>
      <ol start="12" type="1">
        <li>What       qualifications do your teachers hold?</li>
      </ol>
      <p>Teachers working at TGT are required to hold a certification in teaching. Some hold the national recognized “Teacher of Adult Learners” certification received from various colleges. Some teachers hold a Bachelor of Arts Degree and have received further teaching qualifications through an accredited Teachers College. All teachers are required to have had 500 nights on the road directing tours and currently active in touring. Regardless of their training our teachers are there to provide all the tour guide answers!</p>
      
      <p> </p>
    </div></td>
    <td width="525"><img src="Images/Collisium.jpg" width="523" height="672" alt="collisium" /></td>
</tr>
</table>
<table width="990" border="0" align="center" cellpadding="2" cellspacing="0">
<tr>
    <td id="footer"><p>Copyright © 2003 The Tour Guide Training Corporation of Canada</p></td>
</tr>
</table>
<script type="text/javascript">

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

#mainbody has no height restriction nor does it have any scrolling styles. The one that I see that does is .scroll, but I don't see that applied anywhere.
.scroll {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
color: #0F3442;
background-color: #808080;
height: 600px;
width: 450px;
padding-left: 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
overflow: auto;

On file open: "This document contains JavaScript code for a widget that no longer exists."

I had an existing, functional datepicker in a web page.
Recently I downloaded the UI Datepicker in the Widget Browser and installed it in DW CS5. Now every time I load the file that calls the datepicker that I added myself, a warning opens with the following text:
This document contains JavaScript code for a widget that no longer exists. If you don't remove the code, the browser might display JavaScript errors when loading the page. Would you like Dreamweaver to find all instances of this code for you?
Widget: $("#reservDateBegin").datepicker();
Widget: $("#reservDateEnd").datepicker();
Clicking "Yes" opens the file and shows the search box at the bottom of the window with [current document] in File and $("#reservDateEnd").datepicker(); in Matched Text. Clicking "No" just opens the file.
The error is wrong, since installing the widget is what caused the error in the first place!
How can I get DW to stop showing this message?
Thanks for any help.

I do understand you're trying to be helpful. I was just hoping providing the relevant code snippets would be sufficient so I didn't have to take the time to provide a "cleaned" version of the files and upload those to a public-safe location.
Zabeth69 wrote: If you don't understand what 'code at the bottom of the page' means, you have not used one of those systems. I don't know what causes the error code to come up (besides removing a Spry widget, I mean). So if it doesn't apply to you, ignore it.
This is exactly my point: I haven't used any of the DW "systems". I've always manually coded in DW, so I can't have removed a Spry widget in the first place. It wasn't until I installed the Widget using the Widget Browser that I started getting the error (I don't mean adding the datepicker widget to the code using the DW Insert menu - I mean installing the Widget into DW itself). Ignoring such an erroneous/incorrect error seems kind of silly, since every time I open the file I get the error message.
Anyway, as requested, the following are links to the contactUsCleaned.php page, and the php included headerCleaned.php file. Since these use php includes to complete the rendered HTML, they won't look right in the browser, but as you know viewing the source will show the relevant html, javascript, and jquery code. I didn't see any way to upload the files in this forum, which, due to the php code, would be preferable to see exactly what my code looks like...
http://www.eventidewebdesign.com/public/contactUsCleaned.php
http://www.eventidewebdesign.com/public/headerCleaned.php
The footer.php file the contactUs page includes is simply a set of HTML links to the pages on the site, copyright info, and the Google Analytics script. There is no other code in the footer.php file.

IWeb Widgets gone from Published Site Hosted by GoDaddy

I have been using third-party widgets to create components for my iWeb (3.0.4 version) website. They are Beyond iWeb Pro-Pack items. (I copy to iWeb html snippet code windows the code from the Beyond iWeb Pro-Pack widget and hit "apply" and they work in TEST mode). I tested everything on my site to a local file prior to publishing the site to the internet. Upon publishing to the internet, none of these Pro-Pack widgets are visible on my site. They all functioned fine when they were in Local file "TEST" mode. They don't even appear as blank boxes or question marks (which has happened when I have incorrect paths). I wonder if it is the pathways to GoDaddy? I have spoken to GoDaddy techs about my dilemma and they only say the path to my webroot is:
/public_html
This I don’t understand. Don’t I need http://www. ….. and other file references to get to the specific file in my webroot at GoDaddy?
Beyond iWeb Pro-Pack widgets I am using:
Apple Style Video Gallery (Youtube or Vimeo)
Simple Hover Effect
Panoramic Slideshow (Smooth Div Scroll)
Photo Slideshow
When I created the Pro-Pack widgets for iWeb I used file links (through GoDaddy hosting) like http://www.wildmonkeysproductioons.com/images/WMP_VIDEO_PHOTOS/....specific photo.jpg
or---inside the cover path [in Apple Style Video Gallery (Youtube or Vimeo)] or a Youtube link in the video path (example): http://www.youtube.com/embed/LWWLM8QhVaw?rel=0
I also have non-Beyond iWeb Pro-Pack generated widgets like Youtube video widgets that are also missing from the website. I believe the problem is not with my Pro-Pack widgets but with my pathways to GoDaddy.
Does anyone have any suggestions or helpful ideas?
I do not understand website building very well and website code, for sure, I do not know.
Dan

I took your advice and changed some file and folder names. I then updated my widgets to create continuity of connection with their files and photos in GoDaddy's File Manager. Now the BeyondiWeb widgets [Panoramic Slideshow (Smooth Div Scroll)] no longer recognize the path to them. No matter what I use as a path the link is broken.
GoDaddy says the following is the absolute path: /home/username/public_html/
My user name: wildmonkeys
Examples of paths are below:
http://www.wildmonkeysproductions.com/public_html/WMP_Website_Banner_Photos/2013 _MCA_Symposium_GRAND_CANYON_Presentation-26_Dan_small.jpg
/home/wildmonkeys/public_html/WMP_Website_Banner_Photos/2013_MCA_Symposium_GRAND _CANYON_Presentation-26_Dan_small.jpg
/public_html/WMP_Website_Banner_Photos/2013_MCA_Symposium_GRAND_CANYON_Presentat ion-26_Dan_small.jpg
An example of a previously successful linked path (prior to file and folder name changes):
http://www.wildmonkeysproductions.com/WMP Website Banner Photos-small Jpegs NEW/005-RIVER DISCIPLINE-02 Dan*-small
Any ideas?
Dan

IWeb not publishing PayPal button widget

As per Burns Media (see below). I have taken the proper steps to insert a PayPal button. However the button does not show up on the published site. I've done this in the past and it did work but not now. I have the latest update to iWeb and running OSX 6.4.2 Is there a problem with these updates or am I just missing something?
Thanks for your help!
Jerry
Burns Media Posted this: You can certainly use PayPal on your iWeb site, and it's fairly easy. You would indeed use the HTML Widget - first, log in to your PayPal account (or create one if you don't have one) and follow the steps to create a new button (Buy Now, Pay Now, Gift Certificate, etc.) When you've finished making the button, the last step gives you some HTML code to copy and paste into the HTML Widget. Copy the code from the PayPal site, in iWeb drag the HTML Snippet to your page and in the box that pops up paste the code. Hit Apply and you're done! When you publish the site, visitors can click your "Buy Now" box and be taken to PayPal to buy.

I think this is very similar to the instructions you posted, but here is a visual demonstration showing how to add PayPal to an iWeb site
http://www.ragesw.com/blog/2010/09/22/e-commerce-iweb-paypal/

Applying widgets

Similar Messages

Maybe you are looking for