Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Issue with other components - causing overlap

See original GitHub issue

I’m experiencing an issue with other components causing an overlap for example if I have a dropdown using bootstrap, it gets overlapped with a near by component. See screenshot below:

Overlap issue

The issue seems to be with the .react-card-flip and .react-card-flipper because when I disable the following in .react-card-flip:

perspective: 1000px;
transform-style: preserve-3d;

and disable the following in .react-card-flipper:

transform-style: preserve-3d;

It behaves fine. See screenshot below:

dropdown showing fine

Do you know how to resolve this?

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:22 (13 by maintainers)

github_iconTop GitHub Comments

sbardiancommented, Mar 26, 2019

Thanks @AaronCCWong !

AaronCCWongcommented, Mar 27, 2019

@sbardian I will play around with position: relative to see if it affects the functionality. Using relative positioning has caused problems in the past.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to Fix Web Pages That Have Overlapping Boxes
Similarly, box elements may overlap for a few reasons, ranging from positioning errors to overflow issues and simple float problems.
Read more >
Components overlapping each other in React - Stack Overflow
I believe there is some issue in the css, the navbar position is fixed and it's causing the issue.
Read more >
Multiple elements overlapping each other are displaced in ...
We are aware of an issue (caused by a limitation in Google Chrome browsers) wherein a large number of elements overlapping one another...
Read more >
Fixing overlapping components -
After you clone artifacts, two components overlap if they have any artifacts in common, regardless of those artifact versions. The system prevents you...
Read more >
Fix Text Overlap with CSS white-space |
Fix overlapping text by setting CSS white-space from. ... Before you jump to the conclusion that nowrap is no good because it can...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found