Trying to "margin-top" for popup app, not sure why its not moving down?

[Brian-A]

Trying to margin-top popup from app, not sure why its not moving?

While doing inspect element, I isolated the popup bar code but when adding "margin-top" 150px its not moving? Not sure why?

www.extremekool.com

Password01

.modal-card[data-v-d3db2efb] {
    background-color: #fff;
    cursor: default;
    position: static; /* Ensure it respects the normal document flow */
    margin: 1em;
    margin-top: 150px !important; /* Force margin-top */
    box-shadow: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
    max-height: 90vh;
}

[dev_solutions]

Hello @Brian-A 

Can you please confirm where you are adding this css
In which file

Kind Regards 

[BSS-TekLabs]

Do you want like  this?

[Brian-A]

I was looking to put it below the header menu, not sure if it moves with the different screen sizes. I was at the library editing it, margin 150px moved it below.

When adding the code to base.css it looks like it isn't taking effect?

[mt686]

Hey!

So your code looks fine. It works when I use it in the inspector. I don't see your margin-top CSS in your site. Where are you adding it in the code? You can try adding it inline on the card HTMl like: <div data-v-d3db2efb="" class="modal-card" style="margin-top:150px"> . Or show me where you added the code in your theme.

If you want to do this without touching code, you can use EasyEdits . You can make the edits on a free trial and keep them. I'm the dev, fair disclaimer. 

Let me know how it goes!

[Brian-A]

I added it to base.css, but when refreshing its not updating?