Drop down menus
Support Area › Forums › Epic › Drop down menus
- This topic has 11 replies, 3 voices, and was last updated 11 years, 10 months ago by Samuel.
-
AuthorPosts
-
April 18, 2012 at 14:40 #5689Mark KaskeParticipant
When you view the Epic theme in Internet Explorer, drop down menus do not display. It looks like they might be, but if they are, it is in the background.
April 19, 2012 at 10:04 #5706Bill RobbinsModeratorThanks Mark. I did work at one point in time. Most likely it is a CSS issue. I’ll take a look and let you know what I turn up.
April 30, 2012 at 10:29 #5843Bill RobbinsModeratorMark,
It finally hit me last night why the drop-down menus were not visible in Internet Explorer. I hd the same issue with Curator when I first created it, and forgot about this bug. When using Microsoft’s filters to generate a gradient, it becomes impossible to allow any content to spill beyond the container. Here’s how to fix it:
- Go to the Appearance section and select edit to open up the theme editor.
- From the list of files on your right, choose style.css and look for this spot (it’s quite a ways down — line 1153):
body.light header { background-color: #f3f3f3; background-image: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3),to(#dcdcdc)); background-image: -webkit-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: -moz-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: -o-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: -ms-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: linear-gradient(top, #f3f3f3, #dcdcdc); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#f3f3f3', EndColorStr='#dcdcdc'); }
- Delete this:
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#f3f3f3', EndColorStr='#dcdcdc');
- Save your changes.
That should allow your drop-down menu to appear normally in Internet Explorer. Let me know if you have any trouble.
Enjoy your week,
BillApril 30, 2012 at 13:20 #5844Mark KaskeParticipantBill –
Thanks for the help!
I was able to delete the line as you indicated, and pulled up the site in Internet Explorer and the drop-down menus are appearing, however whenever there is a video on the page, the menu drops down behind the video.
See the homepage: http://www.crosswindschurch.com/
Or the stories page and click on the ‘About us’ in the menu: http://www.crosswindschurch.com/about-us/storiesOn all of the other pages, this update seems to be working.
April 30, 2012 at 13:46 #5845Bill RobbinsModeratorMark,
Good question about the videos. Chrome and Internet Explorer often push video from YouTube above all other content unless the embed code is changed just a bit. I have a quick post about how to fix it that hopefully will help get you squared away. The downside is this is something that you’ll have to put into every YouTube video that could have a menu appear over it.
Interestingly, Vimeo doesn’t generally need that.
Let me know if you have any trouble,
BillApril 30, 2012 at 13:57 #5847Mark KaskeParticipantBill –
Thanks! Your support as always is awesome!
Mark
April 30, 2012 at 14:15 #5848Bill RobbinsModeratorI’m glad we got that figured out. Take care Mark!
May 10, 2012 at 09:17 #5942SamuelParticipantBill
I tried this fix as well but when I did it, it changed the entire color scheme of the theme
Any suggestions on what I did wrong?
May 10, 2012 at 10:15 #5943Bill RobbinsModeratorSamuel,
Would you mind sending over a link so I can take a closer look for you?
Thanks,
BillMay 11, 2012 at 10:26 #5956SamuelParticipantHere is the link to the site
http://www.harbourfellowship.com
The code is currently in place as it changes some of the site to the “dark color scheme” when used
May 11, 2012 at 16:08 #5970Bill RobbinsModeratorSamuel,
Thanks for the link. I took a look and everything seems ok. You’ll just need to find this section in the style.css file:
body.light header { background-color: #f3f3f3; background-image: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3),to(#dcdcdc)); background-image: -webkit-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: -moz-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: -o-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: -ms-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: linear-gradient(top, #f3f3f3, #dcdcdc); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#f3f3f3', EndColorStr='#dcdcdc'); }
and just delete this:
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#f3f3f3', EndColorStr='#dcdcdc');
That will leave that section looking like this:
body.light header { background-color: #f3f3f3; background-image: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3),to(#dcdcdc)); background-image: -webkit-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: -moz-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: -o-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: -ms-linear-gradient(top, #f3f3f3, #dcdcdc); background-image: linear-gradient(top, #f3f3f3, #dcdcdc); }
If you have any trouble, let me know and enjoy your weekend,
BillMay 15, 2012 at 14:41 #6008SamuelParticipantGreat – that worked
have no idea what I was doing wrong
Thanks much
-
AuthorPosts
- The topic ‘Drop down menus’ is closed to new replies.