How to center a pop up

Hi I’m making an app for mobile but pop up does not center ; how to change that .

Hi @jackncurious you can either add an id to the popup, so you can use css to adjust the top position of the popup. Or alternatively, you can make the popup transparent, while the inner group with backgeound color will have some margin above it, so that this group will be pushed down. Personally, I’ll recommend the first method.

Hi thanks for your response ; how I add an ID to thé pop up

Go to the settings tab > general > scroll to the bottom of that page, you’ll see an Expose the option to add an ID attribute to HTML elements checkbox, mark that checkbox. After doing that, come back to the element appearance, where you can change the styles of the element, at the bottom is the input “ID attribute”, you can specify you ID value there.

Sorry for the late response what do I put in the ID ? Can your explain it to me step bye step I’m not a developper

Hello @jackncurious, first add an HTML element on your page with the following code.

<style>
    
    #center {
        position: fixed !important;
        top: 48% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
    }

</style>

then put “center” as the ID of your popup

Here are the images with the steps for better viewing


1 Like