Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Page & Category Menu Bars (http://forum.bytesforall.com/forumdisplay.php?f=10)
-   -   [SOLVED] Page Menu Problem in IE (http://forum.bytesforall.com/showthread.php?t=9524)

sleenie Sep 9, 2010 12:12 PM

[SOLVED] Page Menu Problem in IE
 
I'm having some problems with how my page menu shows in IE. Lots of overlapping. It's ok in Firefox though. Below is the code I used, hopefully it isn't too messed up. I know the bar color doesn't go all the way to the sides but I've found the solution to that and will change it. I've attached 2 graphics so you can see how it looks on both of them. It's the upper overlap that I'm concerned about.

What do i need to do to correct the problem in IE?

div#menu1 ul.rMenu {
background: transparent;
border: none;
}

div.widget ul li {
padding: 1px 5px 1px 14px !important;
background: url('<?php bloginfo('template_directory'); ?>/images/bullets/gray-arrow.gif') no-repeat 0 4px;
}
div.widget ul li a:hover {
text-decoration: underline;
}
/* ================================================ */
/* Page menu background */
/* ================================================ */
div#menu1 {
height: 0px;
margin-top:0px;
background: 62250f;
}
/* ================================================ */
/* Page Menu item's background and border */
/* ================================================ */
div#menu1 ul.rMenu {
background: 62250f;
border: 62250f; 5px;
}
/* ================================================ */
/* Page Menu item */
/* ================================================ */
ul.rMenu li a:link,
ul.rMenu li a:hover,
ul.rMenu li a:active,
ul.rMenu li a:visited,
ul.rMenu li {
background: 62250f; !important;
color: #df9c32 !important;
}
/* ================================================== */
/* CSS for setting menu padding */
/* ================================================== */
ul.rMenu li {
padding: 0px 12px 0px 12px
}
ul.rMenu-ver li {
padding-top: 0px 12px 0px 12px
margin-top: 0px 0px 0px 0px;
}

lmilesw Sep 9, 2010 12:47 PM

First I would just like to clean up what I initially see and go from there.
The lines that I Changed are in red. The border syntax needs to be in the order of size, style, color. I don't know that any of these changes will fix your issue but there were some semicolons missing and/or in wrong spots.

div#menu1 ul.rMenu {
background: transparent;
border: none;
}

div.widget ul li {
padding: 1px 5px 1px 14px !important;
background: url('<?php bloginfo('template_directory'); ?>/images/bullets/gray-arrow.gif') no-repeat 0 4px;
}
div.widget ul li a:hover {
text-decoration: underline;
}
/* ================================================ */
/* Page menu background */
/* ================================================ */
div#menu1 {
height: 0px;
margin-top:0px;
background: #62250f;
}
/* ================================================ */
/* Page Menu item's background and border */
/* ================================================ */
div#menu1 ul.rMenu {
background: #62250f;
border: 5px solid #62250f;
}
/* ================================================ */
/* Page Menu item */
/* ================================================ */
ul.rMenu li a:link,
ul.rMenu li a:hover,
ul.rMenu li a:active,
ul.rMenu li a:visited,
ul.rMenu li {
background: #62250f !important;
color: #df9c32 !important;
}
/* ================================================== */
/* CSS for setting menu padding */
/* ================================================== */
ul.rMenu li {
padding: 0px 12px 0px 12px
}
ul.rMenu-ver li {
padding-top: 0px 12px 0px 12px;
margin-top: 0px 0px 0px 0px;
}

sleenie Sep 9, 2010 01:24 PM

Thanks. I have changed those now. I had already changed some of them after I sent the post but not all. That hasn't changed anything though. IE still shows the same.

lmilesw Sep 9, 2010 07:33 PM

Could you export your setting via ATO>Import/Export Settings and attach to a reply (use the paper clip icon)? I need to see this in a live site.

sleenie Sep 9, 2010 08:25 PM

Sure...here it is. Thanks. Any assistance is greatly appreciated.

lmilesw Sep 9, 2010 08:39 PM

It wasn't attached sleenie

sleenie Sep 9, 2010 09:48 PM

Well.... I'll try again. Thx

lmilesw Sep 9, 2010 10:49 PM

The big problem was with this section of CSS Inserts. I took it out and things started working better.
HTML Code:

/* ================================================ */
/* Page menu background */
/* ================================================ */
div#menu1 {
height: 0px;
margin-top:0px;
background: #62250f;
}


sleenie Sep 10, 2010 07:48 AM

Larry,

It does look much better now. What was the problem with that particular insert? I was trying to follow Juggledad's cheat sheet. I learn something new every site I do it seems.

Thanks so much for your help.

lmilesw Sep 10, 2010 10:15 AM

It was just messing with CSS somehow. I just saved the page of your site and started ripping out CSS section by section and that was the one that fixed it. I suspect it had something do to with the 0px.

sleenie Sep 10, 2010 01:00 PM

Thanks Larry...I really appreciate it. I didn't want to play with Larry's code but I guess i should learn to do so more. I'm setting up a site where I can doing some importing and more testing on my own. Good thing they don't charge at W3 Schools for general access.

I think when I move next month I'm going to take a class on CSS.

Again, thanks.


All times are GMT -6. The time now is 09:23 PM.

Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.