search

jasonkuhrt / react-popover

A smart popover component for React
600 stars 253 forks source link

Popover body is not centered over target #185

Open trinile opened 6 years ago

trinile commented 6 years ago

The popover body position is not consistent and hard to get it centered over the target (that is not moving).

ruimigueldp commented 6 years ago

Its not centered when you choose above and below positions. But if you double click it, the body stay aligned with the tip. That is because when the Popover "wrapper" renders into the page for the very first time it has the property of flex-direction: row and calculates the width with the body and tip together. thats why its not centered. for above and below alignments, the flex direction should be column and for right and left row.

ruimigueldp commented 6 years ago

I notice that last week. this package has a lot of potential but seems abandoned

trinile commented 6 years ago

The popover seems to center properly in safari, but not in chrome.

ruimigueldp commented 6 years ago

yep I notice that too! wierd, right? I cant tell why.

trinile commented 6 years ago

@ruimigueldp thanks for the suggestion about the flex. I set the .Popover-below to flex-direction: column and that seemed to fix the centering issue!