Why are the buttons on my mobile website's dawn theme not displaying correctly?

Topic summary

A user is experiencing a display issue with buttons on the mobile version of their Dawn theme website, where the top border is being cut off on some buttons.

Current situation:

  • The user has implemented custom CSS to create uniform outline-only buttons across the site
  • The issue only affects the mobile version; desktop appears to be working correctly
  • The provided CSS code appears corrupted or improperly formatted in the post

Progress:

  • A web developer requested the store URL to investigate
  • The user shared their website (zukabeauty.com.au)
  • The user followed up asking for a code solution

Status: The discussion remains open with no solution provided yet. The developer has not responded with a fix after receiving the URL.

Summarized with AI on November 23. AI used: claude-sonnet-4-5-20250929.

I am having trouble with my buttons on my website, only on the mobile version. The top line/border has been cut off a few of the buttons. I have added the following code to ensure all of my buttons are the same (outline only).

.button{color: #4C4C4D;}
.button:before, .button:after, .button:hover:after{box-shadow:none; border: 0.50px solid #4C4C4D;}

a.button.button–primary {

background: transparent !important;

}

.button:hover{
background: #F9E6E0;
color: #4C4C4D;
}

a.button.button–primary:hover {
background-color: #FFF5F0 !important;
}

a.button.button–primary {
border: 0.50px solid #4C4C4D;
}

@tahliamotteram

Please share your store url.

Oh sorry! It’s:

https://www.zukabeauty.com.au/

Hi just checking on the above, were you able to suggest a code to fix it? Thanks so much

www.zukabeauty.com.au