Spry menu with 1px (line? shift?) down in IE7
Hi. I built a spry menu that works great on my Mac using Safari, Opera, Firefox, Flock, Navigator. But on my PC, using IE7, there appears a 1px (white) line at the top of the menu. At first, I thought IE7 was shifting the menu down 1px. But I see a 1px (white) line between (at the top of) each submenu item, and think it may be the same issue. Can anyone help?
Thanks.
Here's the example: http://www.ontherise.org/Rev/
Here's the css I'm using for the menu:
@charset "UTF-8";
/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: auto;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 12px;
list-style-image: none;
text-decoration: none;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
z-index: 1000;
/* Menu item containers, position children relative to this container and are a auto width that stretches to accomodate text */
ul.MenuBarHorizontal li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
width: auto;
float: left;
list-style-image: none;
text-decoration: none;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 19em;
position: absolute;
left: -1000em;
text-decoration: none;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: auto;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
width: 19em;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
left: auto;
top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
border: 1px solid #FFFFFF;
/* Menu items are a red block with padding and no text decoration. Stephen added the ul.MenuBarHorizontal a:visited to keep the same treatment for visited links */
ul.MenuBarHorizontal a, ul.MenuBarHorizontal a:visited
display: block;
cursor: pointer;
background-color: #992E2E;
color: #FFFFFF;
font-weight: bold;
text-decoration: none;
padding-top: 0.5em;
padding-right: 2em;
padding-bottom: 0.2em;
padding-left: 0.5em;
text-decoration: none;
/* Stephen added this id selector so a clicked main tab would remain a white block*/
#clicked
background-color: #FFFFFF;
color: #000000;
text-decoration: none;
/* Menu items that are open with submenus are set to MenuBarItemHover with a white background and black text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
background-color: #FFFFFF;
color: #000000;
text-decoration: none;
/* Menu items that have mouse over or focus have an orange background and black text. Stephen added the ul.MenuBarHorizontal a:hover#clicked so the hover highlight color would appear when you mouse over a clicked state main menu item */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus,
ul.MenuBarHorizontal a:hover#clicked
background-color: #FFCC66;
color: #000000;
text-decoration: none;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
background-image: url(SpryMenuBarDown.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarDownHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
position: absolute;
z-index: 1010;
filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarHorizontal li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;
I guess the real question is: is there any reason IE7 would add a 1px white line at the top of the main menu and each submenu?
Similar Messages
-
Trying to get the ipad to open after doing a software update. I only get the itunes logo with an arrow pointing toward it and a lock symbol with a line going down towards the screen button. Any suggestions to get this to open?
You are in Recovery Mode. Follow the instructions below to recover your iPad.
http://support.apple.com/kb/ht4097 -
Spry Menu with submenu border?
Hi Everyone,
I'm a bit of a newbie, and I am designing a website with a spry menu (which I have since found out probably wasn't the best way to go) and I have hit a hurdle which I can't fix or find the solution to anywhere. I'm hoping it might be easy for you guys.
I have attached a pic of the problem, one menu item has a submenu, this is the 'About' menu, as you can see, it has a border top and bottom that I can't seem to find in the code in order to get rid of it. If anyone could let me know how to fix this I'll be extremely grateful!
Also, any suggestions of better menu methods would be appreciated.
Have a nice day
Spry CSS below:
@charset "UTF-8";
/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: 100%;
float: none;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
z-index: 1000;
/* Menu item containers, position children relative to this container and are a fixed width KN: width changed to auto */
ul.MenuBarHorizontal li
margin: 0;
list-style-type: none;
font-size: 18px;
position: relative;
text-align: left;
cursor: pointer;
width: auto;
white-space: nowrap;
float: left;
font-family: Arial, Helvetica, sans-serif;
font-style: normal;
font-weight: bolder;
text-transform: uppercase;
padding: 0;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: auto;
position: absolute;
left: -1000em;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: auto;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
float:none;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
left: auto;
top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
/*ul.MenuBarHorizontal ul
border: 1px solid #CCC;
/* Menu items are a light gray block with padding and no text decoration. KN: I removed the border radius prior to this it was border-radius: 5px 5px 0px 0px;*/
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
padding-left: 1.1em;
padding-right: 1.1em;
padding-top: 1em;
padding-bottom: 1em;
text-decoration: none;
color: #009007;
border-bottom: 2px;
border-right: 0.3px #333333;
border-bottom-color: rgb(51,51,51);
background-image: url(../Images/spry-menu%20chrome.jpg);
background-position: right;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
color: #333;
background-image: url(../Images/spry-menu-chrome-hover.jpg);
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
background-image: url(../Images/spry-menu-chrome-hover.jpg);
color: #333;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
background-repeat: no-repeat;
background-position: 95% 50%;
color: rgb(0,141,7);
background-image: url(../Images/spry-menu%20chrome.jpg);
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
background-repeat: no-repeat;
background-position: 95% 50%;
background-color: rgb(3,139,7);
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
background-position: 95% 50%;
background-image: url(../Images/spry-menu-chrome-hover.jpg);
color: #333;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
background-position: 95% 50%;
background-image: url(../Images/spry-menu-chrome-hover.jpg);
color: #333;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
position: absolute;
z-index: 1010;
filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarHorizontal li.MenuBarItemIE
display: inline;
float: left;
background: #FFF;Hi Gramps,
Here is the site:
http://www.wordartist.com/mythicharacters
If you hover on "Sacred Arts", you'll see the behavior.
Thanks for taking a look at this,
Phlange98 -
POP UP menu with image not pull down
I'm new to fireworks. I've looked at tutorials, but it seems
all the pop up menu features are for pull down menus. I want to
press the button and have a blank ( separate window 360x 303 pixals
) pop up with a jpeg image in it. How do I do this?katveze,
What you are wanting to do is called Disjointed Rollovers.
Here is a
great tutorial to point you in the right direction:
http://www.communitymx.com/content/article.cfm?cid=E11E8
alex
katveze wrote:
> I'm new to fireworks. I've looked at tutorials, but it
seems all the pop up
> menu features are for pull down menus. I want to press
the button and have a
> blank ( separate window 360x 303 pixals ) pop up with a
jpeg image in it. How
> do I do this?
> -
Spry Menu with Dynamic Content
I am having a problem with Spry Menus where the content is
created dynamically, from another Javascript function.
This seems to be a Firefox issue: it works in IE7.
The menu content loads, but the drop down functions don't
work. Is there a way to make this work.
Here is an example:
quote:
<head>
<script src="spry/SpryMenuBar.js"
type="text/javascript"></script>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1",
{imgDown:"../SpryAssets/SpryMenuBarDownHover.gif",
imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
//-->
function loadMenu() {
... script to build menu content (strMenu)...
document.getElementByID(MenuBar1).innertHTML=strMenu;
//-->
</script>
<body onload="loadMenu()">
<div id="menu">
<ul id="MenuBar1" class="MenuBarHorizontal">
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu" href="#">Item
1</a>
<ul>
<li><a href="#">Item 1.1</a></li>
<li><a href="#">Item 1.2</a></li>
</ul>
</li>
<li><a class="MenuBarItemSubmenu" href="#">Item
2</a>
<ul>
<li><a href="#">Item 2.1</a></li>
<li><a href="#">Item 2.2</a></li>
</ul>
</li>
</ul>
</div>
</body>
I have tried putting the creation of the menubar widget after
the menu was filled, but that did not work either.
Thanks,
RobHi,
You should use observers to activate the Menu after the
markup is built.
This has to do with the way styles are applied.
http://labs.adobe.com/technologies/spry/samples/menubar/MenuFromNestedData.html -
How do you fix a screen with colored lines going down left side
my HP DV6 notebook has a dark spot going half way down screen and red,green,blue lines on left side of screen,how do I fix this, some have said I could maybe replace cable in the hinge area on left side, I am a senior citizens, is there a utube showing how to do this, if you think this is my problem , help
Hi @gloriacarsale2 ,
Thank you for visiting the HP Support Forums and Welcome. I have looked into your issue about your HP Pavilion dv6 Notebook and LCD screen giving you an issue. You could reset the BIOS with this document selecting the reloading the BIOS default settings.
I would be happy to assist if needed. How Do I Find My Model Number or Product Number?
Please let me know.
Thanks.
Please click “Accept as Solution ” if you feel my post solved your issue, it will help others find the solution.
Click the “Kudos, Thumbs Up" on the bottom to say “Thanks” for helping! -
Formatting restaurant menu with dotted line to price, what I see isn't what I get.
I have returned to Dreamweaver CS3 after using homesite for a
couple of years. I've been using both. I thought dreamweaver would
be helpful for things that would be easier when you really need to
visualize them. I've gone round and round about how to redo a
restaurant menu. I decided to stick with a table but to simplify
the coding. Each item is set up as follows. The item is in the left
cell along with the leading periods and the prices are in the right
cell.
Pad Thai
Chicken....................................................................
$8.95
Shrimp.......................................................................$9.95
The problem is that I have to guess how long the line of
periods needs to be in Dreamweaver. I can't just bring the line up
to the end of the cell. I guess, save and look at it in a browser
to see if it's right. Some lines need to be shorter or longer and
there's no rhyme or reason, at least as far as I can tell. Below is
an example of how different lengths can equal the same thing when I
look in the browser.
Please note, I can't get the forum to line up the prices but
they should be lined evenly up since there in the right hand cell.
Pad Thai
Chicken....................................................
$8.95
Shrimp.....................................................................
$9.95
Beef.....................................................................
$10.95
I'm wondering if there's something I'm not understanding or
if there's something I can do to really display WYSIWYG.
Thanks.> I'm wondering if there's something I'm not understanding
or if there's
> something I can do to really display WYSIWYG.
You'll never get this done in WYSIWYG.
The trick is to use a little CSS with an image of a series of
dots declared
as the background image of the table cell. Let it repeat
across the cell.
You have what you want.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"amy3000" <[email protected]> wrote in
message
news:[email protected]...
>I have returned to Dreamweaver CS3 after using homesite
for a couple of
>years.
> I've been using both. I thought dreamweaver would be
helpful for things
> that
> would be easier when you really need to visualize them.
I've gone round
> and
> round about how to redo a restaurant menu. I decided to
stick with a table
> but
> to simplify the coding. Each item is set up as follows.
The item is in
> the
> left cell along with the leading periods and the prices
are in the right
> cell.
>
>
Pad Thai
>
Chicken....................................................................
> $8.95
>
>
Shrimp.......................................................................$9.
> 95
>
> The problem is that I have to guess how long the line of
periods needs to
> be
> in Dreamweaver. I can't just bring the line up to the
end of the cell. I
> guess,
> save and look at it in a browser to see if it's right.
Some lines need to
> be
> shorter or longer and there's no rhyme or reason, at
least as far as I can
> tell. Below is an example of how different lengths can
equal the same
> thing
> when I look in the browser.
>
> Please note, I can't get the forum to line up the prices
but they should
> be
> lined evenly up since there in the right hand cell.
>
>
Pad Thai
>
Chicken....................................................
> $8.95
>
Shrimp.....................................................................
> $9.95
>
Beef.....................................................................
> $10.95
>
> I'm wondering if there's something I'm not understanding
or if there's
> something I can do to really display WYSIWYG.
>
> Thanks.
>
>
> -
Help iPhone 5 completely black & white glow in the middle with pink lines vertically down the screen
i got my iphone 5 screen fixed, and since then the screen this is what has happend and I can't use it.
If Apple or an Authorized Apple Service Provider replaced the screen, bring it back and let them check the phone, repairs are also covered by a short warranty period.
If a 3rd party did replace the screen, you can't bring it to Apple to get it serviced, Apple does not allow others to do repairs on their devices. In that case, those who fixed the screen, have to do something about that. -
Spry Vertical Navigation menu with secondary flyout menu not showing
I'm using Windows and CS3. I have a vertical spry menu with one of the items opening to a secondary vertical menu. The menu is positioned left and I want the flyout menu to open so it can be seen on top of the central content column. I have a background color on the central div and when I hover over the item on the menu bar, you can't see the secondary menu opening. But I know it is there as I have removed the central div and when previewed in the browser (IE) it works fine. But when I replace the central div, the secondary menu is hidden again. I don't want to play around too much as I know Javascript is involved and I can easily ruin those elements which are now working. I hope someone can suggest something reasonably straight forward to assist.
The code is the standard stuff - I have only modified colours basicall with one or two other tweaks to fit the space:
ul.MenuBarVertical
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: 200px;
background-color: #979c9c;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
border-bottom-width: 1px;
border-bottom-color: #FFFFFF;
ul.MenuBarActive
z-index: 1000;
ul.MenuBarVertical li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
width: 200px;
color: #343642;
ul.MenuBarVertical ul
padding: 0;
list-style-type: none;
font-size: 100%;
position: absolute;
z-index: 1020;
cursor: default;
width: 200px;
left: -1000em;
top: 0;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 100%;
ul.MenuBarVertical ul.MenuBarSubmenuVisible
left: 0;
ul.MenuBarVertical ul li
width: 200px;
ul.MenuBarVertical ul
ul.MenuBarVertical a
display: block;
cursor: pointer;
background-color: #979c9c;
color: #343642;
text-decoration: none;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 20px;
ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
background-color: #343642;
color: #fff;
ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible
background-color: #343642;
color: #fff;
ul.MenuBarVertical a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
ul.MenuBarVertical a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
ul.MenuBarVertical iframe
position: absolute;
z-index: 1010;
filter:alpha(opacity:0.1);
@media screen, projection
ul.MenuBarVertical li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;
Thanks.Frank,
The code that you have shown us re SpryMenuBarVertical.css is correct so that we can assume that the problem lies elsewhere.
Because you have not shown the rest of the code, we can only make assumptions which may or may not help. From the above screen shot, I see that you are using AP's (Absolute Positioned) elements. This is a NO NO!!!
Have a look at the following wich achieves the same, but without AP's. Just copy and paste in a new document and view in any browser.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
margin: 0;
padding: 0;
html {
height: 100%;
background: #FFC;
body {
width: 960px;
margin: auto;
background: #060;
h1, h2, h3, p {
margin: 0 20px;
#header {
height: 95px;
background: #060;
#sidebarL {
width: 160px;
float: left;
color: #CCC;
#content {
width: 800px;
float: left;
background: #FFF;
#sidebarR {
width: 200px;
float: right;
background: #FF3;
#footer {
height: 50px;
background: #060;
color: #CCC;
clear: both;
</style>
</head>
<body>
<div id="header"><h1>This is my Header</h1></div>
<div id="sidebarL">
<h3>This is my sidebar</h3>
<p>This is where our menu goes</p>
</div>
<div id="content">
<div id="sidebarR">
<h3>This is my other sidebar</h3>
<p>Sed do eiusmod tempor incididunt ullamco laboris nisi velit esse cillum dolore. Duis aute irure dolor sunt in culpa lorem ipsum dolor sit amet. Qui officia deserunt consectetur adipisicing elit, ut enim ad minim veniam.</p>
</div>
<h2>This is the content</h2>
<p>Velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, ullamco laboris nisi sed do eiusmod tempor incididunt. Ut labore et dolore magna aliqua. Sunt in culpa in reprehenderit in voluptate ut aliquip ex ea commodo consequat.</p>
<p>Duis aute irure dolor quis nostrud exercitation lorem ipsum dolor sit amet. Ullamco laboris nisi consectetur adipisicing elit, qui officia deserunt. Ut labore et dolore magna aliqua. Quis nostrud exercitation. Velit esse cillum dolore ut aliquip ex ea commodo consequat.</p>
<p>Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut enim ad minim veniam. Eu fugiat nulla pariatur. Duis aute irure dolor sunt in culpa lorem ipsum dolor sit amet. Cupidatat non proident, excepteur sint occaecat velit esse cillum dolore.</p>
</div>
<div id="footer"><p>and lastly here is my footer</p></div>
</body>
</html>
Gramps -
Using a background image for the buttons in spry menu
Hi All,
Going nuts here.
I'm using the vertical spry menu widget w DW CS3 and trying
to alter the css style sheet, so that I can use a li class for each
of the 14 links on this page, with an upstate and a hover state
only. (the focus, and hover while down will be the same as the
others, to keep it simple and not too distracting)
The page is here that I will be replacing the entire
background image in sidebar1 and sidebar2 with a custom spry menu
with the 14 li classes for 2 seperate menus:
http://audibleimagesav.com/blank_doc.html
Has anyone used a background image in place of just using
bkgrd colors and borders for the spry menu ?
I am aware of the attributes that the help docs suggest that
need to be altered as listed here :
http://livedocs.adobe.com/en_US/Spry/1.4/help.html?content=WS0BB04E11-1BE3-4a67-BC94-BE7DA 93A0159.html
I have been working on just an experimental page, that is now
hacked up, however if you want to see that it is here with only the
first list item coded:
http://audibleimagesav.com/site%20theme%20ideas/sprymenu_exp.html
The spry css menu widget for that page is here:
http://audibleimagesav.com/SpryAssets/SpryMenuBarVertical.css
So in short, has anyone done a bkgrd image for the main menu
(not submenu) in a spry widget?
Thanks in advance.
Art
Art Hansen
Web Design & Marketing
http://www.innova-techsolutions.com
321.750.3852 - Cocoa Beach, Florida, USAhttp://meyerweb.com/eric/css/edge/popups/demo2.html
Maybe -
Dreamweaver Spry Menu Not Working Properly
Hello,
I'm putting a horizontal spry menu bar into a table cell (I haven't had the time to learn how to use divs yet and tables have been working fine for me). I have 6 items in the menu with 2 or3 drop down menus for each one. When I view it in live view, when I roll over the menu items, the whole bar drops down to the left side and becomes vertical. Why is this happening? It is shorter than the table cell so that shouldn't be the problem. Thank you for your help.Okay, this is crude, but it's as far as I got. Only some of the buttons cause the menu to move down. Please keep in mind that I am a designer, not a programmer. I'm learning, but am very weak when it comes to coding knowledge. Thanks.
http://littlechisel.com/Ideal_Window/ -
To eliminate the fuzzy line around the boxes, I understand
how to in Accordion and other SPRY. But, I can not figure it out in
SPRY Menu with both the main and sub menus.
Can someone please advise as to what Style is needed? For
example "TabbedPanelsTab:Focus, but for SPRY Menu. ??
Regards,
John MYou're probably looking for this one:
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
in SpryMenuBarHorizontal.css or this one:
ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
in SpryMenuBarVertical.css.
Best - Joe
Joseph Lowery
Vice President of Marketing, WebAssist
Author of Dreamweaver CS3 Bible
"mcgregorlink" <[email protected]> wrote in
message
news:fleia0$ihc$[email protected]..
>
> To eliminate the fuzzy line around the boxes, I
understand how to in
> Accordion
> and other SPRY. But, I can not figure it out in SPRY
Menu with both the
> main
> and sub menus.
>
> Can someone please advise as to what Style is needed?
For example
> "TabbedPanelsTab:Focus, but for SPRY Menu. ??
> Regards,
>
> John M
> -
I'm looking to only change the hover on the submenu of the
spry menu I'm creating. In the CSS file I seperated the lines that
have all the MenuBarHorizontal hovers grouped together but that
didn't work. I dont' want the background-color to change on the
main menu when hovered, however, I'd like the submenus
background-color and color to change. Please help.
Email meThe sample page I posted came after searching for an easy
"how to do it". The closest I found to a tutorial was this:
http://www.adobe.com/devnet/dreamweaver/articles/spryte_menu.html
The author designs and implements a spry menu with Fire Works
graphics. The last section describes how to modify the existing CSS
for multiple levels. Yet I found the sample page easier to follow.
I hope this helps though. -
I am using a spry menu with a transparent background, but it
shows up as white in IE. Also, how can I make the top level have a
transparent background and the drop downs have a color background?You can find the answer for thisin the same forum
-
Hi,
While running link checker on my site, I discovered the
SpryMenuBar.js file is shown as a broken link (and probably why
when i view my site in a browser, none of the drop down menus
work). I searched my hard drive and the file is nowhere to be
found...actually, didn't even know it existed. Question is, can I
get it back somehow?"dreamnew" <[email protected]> wrote in
message
news:f4rkr2$g6i$[email protected]..
> Ok, when I created the new page in the same site as you
suggested, I did
> get
> the SpryAssets folder,
Ok, that's good, we know it's working as it should. Take a
look in the site
definition preferences, there is a section for Spry - you can
set where the
Spry files get written.. maybe there's something in there
that's not quite
right.
> before the few spry files I had were just in the file
> manager listing, right along with my othr files. Very
strange indeed.
This is confusing me... are you saying that the spry files
were just mixed
in with the rest of your files? but weren't saved to a Spry
folder?? I
thought you said that no such js file was created....
> So, will the menu settings I've created on the template
and other pages of
> my
> site need updating somehow or does it automatically pick
up the .js file?
You will need to check your original file and see where the
Spry Menu js
script is being pointed to?
As long as the JS script and the css file are pointing to the
correct files
so that paths are correct, then you will be able to edit the
Spry menu with
no problems.
Hope all that makes sense :-)
Nadia
Adobe® Community Expert : Dreamweaver
CSS Templates |Tutorials |SEO Articles
http://www.DreamweaverResources.com
~ Customisation Service Available ~
http://www.csstemplates.com.au
Spry Widget Examples
http://www.dreamweaverresources.com/spry-widgets/
Maybe you are looking for
-
Moved to Helsinki with my 8320 Curve unlocked, can't get it to work
Hi, I just moved to Finland and brought with me the 8320 Curve, which I previously unlocked from T-Mobile. They basically gave me the instructions and said it would be free to use with a new SIM card. I just got a SIM card and the cellphone works per
-
Apex_util.get_blob was not found on this server
Hi All, APEX Version: 3.1.1.00.09 Database version 11g I am trying to create a report, with a column having a link to download the file stored as BLOB type in the database. I performed the following steps: *1. created custom report base on SQL Query:
-
My Internet Security has gone. How do I get it back on this browser?
My Trend Micro Internet Security which keeps me safe from all bad places has disappeared leaving me feeling unprotected, which I don't like at all. How do I get it back on this updated firfox? If this can't be done I would like to revert back to the
-
HT4972 i have just updated my 3S and it has failed to activate. what can i do?
i have just updated my 3S and it has failed to activate. what can i do?
-
Missing filters (in PS) after exporting from lightroom
I am currently moving my photo editing from a 32-bit WinXP machine to a 64-bit Win7 machine. For the time being, both computers have CS4 Design Premium and Lightroom 2.5 installed. All apps on both machines are currently up-to-date. The issue, and