Button background color is not showing on edge, but working on Firefox and Chrome

Question

I am designing my login page. I have added button background color, which is showing on chrome and firefox perfectly, but it does not showing on microsoft edge. Below are my HTML and CSS, note - I have tried with many color, all are working on chrome and firefox but not in edge

HTML

         .index-un-right-nav-buttom{
                float: left;
                height: auto;
                padding-top: 10px;
                padding-bottom: 10px;
                width: 100%;
            }
                .index-un-right-nav-submit-button{
                    float: left;
                    padding-top: 5px;
                    padding-bottom: 5px;
                    height: 50px;
                    width: 100px;
                    margin-top: 20px;
                    margin-bottom: 20px;
                    margin-left: 10%;
                    border: none;
                    outline: none;
                    color: #ffffff;
                    background-color: #007182fb;
                    font-family: Arial, Helvetica, sans-serif;
                    font-size: 18px;
                    border-radius: 50px;
                }

<span class="index-un-right-nav-button">
    <button class="index-un-right-nav-submit-button">Login</button>
</span>

       

In firefox,

In Edge

In chrome,

Answer 1

Edge doesn't support the 8-digit color notation. See CanIUse.

Use

background-color: rgba(0, 113, 130, 0.984);

instead.

Answer 2

Try changing

background-color: #007182fb;

to

background-color: #007182;

hope that fixes the problem.

Also clearing the browser cashe might help.