Having a very strange IE7 issue that I cannot find a fix for. I have created a slideshow with a control nav absolutely positioned at the bottom of it. The nav sits over the slideshows bottom border.
In ie7, hovering over it cause the nav to jump behind the border and hence the top of it disappears. I don't have a clue what is happening and cannot find solutions elsewhere. Here is a link demonstrating the issue:
http://rivaslider.matthewruddy.com/
Anyone have a solution? Pulling my hair out.
Related
My slider component disappears when it should pin to the page. I believe it is related to the page scroll with Locomotive scroll messing up with translating the page. However, this should be possible and I found a tutorial by Greensock. I cannot get it to work though, my content keeps disappearing. Here is a minimal demo: https://codesandbox.io/s/cool-noyce-108h6c?file=/pages/index.tsx
Here is also a link to the final webpage: https://juliaweber-git-preview-inzn.vercel.app
Any help is greatly appreciated!
I'm using react-big-calendar with react-sidebar and if the sidebar opens, all the area is covered by overlay but some elements are visible on the top.
What can be the problem?
P.S: I've also given the z-index to both but nothing worked for me!
react-big-calendar with react-sidebar
I don't know the particulars of react-sidebar, but it's definitely a z-index issue. Does react-sidebar provide a Portal option for it's overlay (I'm not seeing one)? RBC is dynamically writing out the events to the page, and using 'auto' z-index, so if your overlay is defined first (like the sidebar is on the left, and calendar on the right), then that's what's happening.
I am currently using this code.
<g:plus action="share" annotation="bubble" expandTo="top" href="#">
The expandTo is not working though. The info popup just show below the share button. I need it to display on top.
Thanks for any help :)
Edit: It appears it displays relative to where there share button is displayed on screen. If it is at the bottom of the screen then the bubble appears on top.
Is there a way to force the bubble to the top?
I have a problem with ie7 z-index behaviour.
Opening this page with ie7, the dropdown menu (some sections have it, some other doesn't) falls behind the slider.
I tried to solve using z-index and position of the parent element, but couldn't fix the thing.
Do you have any idea how to make the dropdown menu stay in front of the slider?
Thanks.
Try wrapping the nav menu with an additional container, then give to the wrapping div a bigger z-index than the z-index used in the nav menu.
This is a known issue of IE7 reported HERE on 2006.
There's an article that shows the workaround that can be used to solve the problem.
Take a look HERE.
As an example imagine you have a div with id="menu" for your navigation menu, you should do something like this:
<div id="wrapper" style="position:relative; z-index: 1000;">
<div id="menu" style="position:absolute; z-index: 999;"></div>
</div>
I think you can easily adapt it to your website.
Now i don't have a copy of IE7 and i can't reproduce the problem, but you can try and that should fix your problem. If it doesn't i'll try to assist you furtherly.
I'm having an IE7 issue with a website i'm working on - www.mini-meals.co.uk
Basically, the background image is not showing on behind the form on the 'Free Trial'
panel, and is disappearing when I scroll down on the others.
I've tried adding position:relative; on a bunch of elements but it doesn't seem to
make a difference.
Any ideas anyone? thanks.
Add this style to your page to see if you are experiencing an issue with hasLayout:
.panel .panel-wrapper { zoom: 1; }
If this does correct your issue than a more "standard" way of correcting the background rendering would be to set an explicit width to those same ".panel-wrapper" items.