Home/ Questions/Q 7729761
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-01T06:03:12+00:00

The sample page: <!DOCTYPE html> <html> <head> <meta charset=utf-8> <title>Button test</title> <style> * {

  • 0

The sample page:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Button test</title>
    <style>
      * { border: none; margin: 0; padding: 0; }

      body { padding: 5em; }

      span { background: lightblue; display: inline-block; }

      button { background: red; outline: 1px solid red }
      button div { background: yellow; }

      button::-moz-focus-inner {
        padding: 0;
        border: 0;
      }
      button {
        -webkit-appearance: none;
        -webkit-box-sizing: content-box;
        -webkit-box-align: start;
        -webkit-border-fit: lines;
        -webkit-margin-collapse: discard;
      }
    </style>
  </head>

  <body>
    <span>Adjacent text</span><button><div>Button</div></button>
  </body>
</html>

Here is the image:

You can see the extra white padding in the button. Is it possible to get rid of that padding in Safari browser?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The problem is fixed in some version of Safari, I’m not sure what exactly, but in latest (5.1.5) it works for me.

    • 0