*, *::after, *::before {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
}

body {
 padding: 2em;
}

.tooltip {
 position: relative;
 background-color: silver;
 width: 200px;
 height: 50px;
 border-radius: 0.25em;
 display: flex;
 justify-content: center;
 align-items: center;
}

.triangle {
 display: block;
 height: 0px;
 width: 0px;
 border: 10px solid transparent;
 border-top-color: silver;
 position: absolute;
 bottom: -20px;
 left: calc(50% - 10px);
}