Dear mr, ms,

How can i center the bubble for WPC Fly Cart, when i try to do this with css for example under, it does not center. Do you guys maybe have a solution for this?

#woofc-count {
    left: 50%;
}

Kind regards,

Niko

Hi Dustin, 

Thankyou for your reply, so unfortunately i have tried this method as the object holds a 40px from left or right standard. Cause of this it is impossible to simply make it 100% center.

In the meanwhile i have tried some stuff and discovered a method that works. (Might be useful for some one in the future)

So i made a div and copied the outer html of #woofc-count  (you can do this by inspecting the flycart and copy outer html)
Make it looking like this in the html section i created ( i added another div around with a custom class so i can make it fixed and hide the other flycart after)

<div class="yourCustomClass">
            <div id="woofc-count" class="woofc-count woofc-count-bottom-left woofc-count-shake">
                <i class="woofc-icon-cart7"></i>
                    <span id="woofc-count-number" class="woofc-count-number"></span>
            </div> 
</div>

So then i added this css to yourCustomClass to make it fixed and flex

.yourCustomClass {
position: fixed;
bottom: 0px;
display: flex;
justify-content: center;
flex-direction: row;
}

And then added these changes in css on class .woofc-count making it always perfectly display in the center

.woofc-count {
display:flex !important;    
position: static; 
align-items: center; 
justify-content: center;
}

Ofcourse you need to hide the original fly cart so you wont have two fly carts this can be simply done by this.

add this code to css  to make the fly cart hidden >

.woofc-count { visibility: hidden }

add this code to css to make the flycart visible what is in the div class .yourCustomClass > 

.yourCustomClass .woofc-count { visibility: visible }

I hope this can be useful for someone in the future, as it has helped me, ofcourse there might be better ways but this works perfectly fine for me.

Kind regards,

Nikolaos K