FORUMS: list search recent posts

IE Not Playing Nice with DW Horizontal Spry Menu

COW Forums : Web Design

<< PREVIOUS   •   FAQ   •   VIEW ALL   •   PRINT   •   NEXT >>
Shweta ShyamaniIE Not Playing Nice with DW Horizontal Spry Menu
by on Jul 30, 2009 at 3:22:30 am

Hi there,

I'm having some trouble with a horizontal spry menu in IE I created in Dreamweaver CS4. I'm using an image to create a menu bar with rounded corners and no background color and IE is inserting a white box behind the menu bar, which not only looks unattractive, but is cutting off the top of the button image. It looks fine on FF.

http://www.liberation2010.com/

Any ideas on how to get rid of it so the buttons render properly?

Thanks so much!
Shweta


Return to posts index

Mike SmithRe: IE Not Playing Nice with DW Horizontal Spry Menu
by on Jul 30, 2009 at 9:29:55 am

If you can get your code to comply with w3c standards IE should then render your page in "standards" mode rather than its more idiosyncratic "quirks" mode, which might help you. http://validator.w3.org/


Return to posts index

Shweta ShyamaniRe: IE Not Playing Nice with DW Horizontal Spry Menu
by on Jul 30, 2009 at 1:13:51 pm

Thanks Mike! I ran the page through the validator and corrected the errors that it identified so now the page is W3C validated but the issue is still happening in IE. Any other thoughts?


Return to posts index


Fernando MolRe: IE Not Playing Nice with DW Horizontal Spry Menu
by on Jul 30, 2009 at 2:16:38 pm

This two rules are controlling the hover bg on your submenus:

/* Menu items that have mouse over or focus have a white background and orange text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
{
background-color: #FFF;
color: #FF9900;
background-image: none;
}
/* Menu items that are open with submenus are set to MenuBarItemHover with a white background and orange text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
{
background-color: #FFF;
color: #FF9900;
}


As you can see, the rules define a white background color. If you change that for a background-image you should keep the rounded borders.

The rules are in your external SpryMenuBarHorizontal.css

*We are in this forum just for the fun of share. We are not related to any mayor software company and the only payment we expect for our time is a little "thanks".


Return to posts index

Shweta ShyamaniRe: IE Not Playing Nice with DW Horizontal Spry Menu
by on Aug 7, 2009 at 4:23:31 pm

Thanks so much! I was able to clear the background out but now the submenu items have a little space in between the buttons. I can live with it though ;)

Many thanks for your assistance, I really appreciate it!!

Shweta


Return to posts index

Mike SmithRe: IE Not Playing Nice with DW Horizontal Spry Menu
by on Jul 30, 2009 at 2:46:41 pm

Good stuff. Perhaps next step might be to validate your css at http://jigsaw.w3.org/css-validator/ - as of just now there are some typos or other errors not helping you. You will see that the Spry stylesheet FSpryMenuBarHorizontal.css contains css errors ...
http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=ht...
It may be that fixing those helps - at least you will know.

Your post history suggests this one has been bugging you for a while - I should tell you that the layout is a mess in FF2 as well ... with the bulk of the main layout area pushed way off to the right of screen ...

There's some stuff at http://www.456bereastreet.com/archive/200612/internet_explorer_and_the_css_... that will give you a little background on how IE (esp IE6) handle the css box model in a non-stnadards-compllant way - which again may help you.

If this menu plus associated css is a pre-designed block you inserted from somewhere and didn't code, I'm horribly afraid it has bugs and you are going to have to dig into its css to fix it.





Return to posts index


Shweta ShyamaniRe: IE Not Playing Nice with DW Horizontal Spry Menu
by on Aug 7, 2009 at 4:21:54 pm

Thanks so much Mike. I think I have a lot to learn about all this stuff ;) I was able to get the content to shift back over to the center of the main container through the CSS.

I really appreciate the resources you sent and your great suggestions.

Many, many thanks!
Shweta


Return to posts index

<< PREVIOUS   •   VIEW ALL   •   PRINT   •   NEXT >>
© 2017 CreativeCOW.net All Rights Reserved
[TOP]