Por lo general, las personas intentan descubrir cómo centrar verticalmente las cosas, quiero eliminar una instancia de contenido centrado y alinear y estoy atascado.

El contenido del botón (que se coloca en una lista en una celda de la tabla) está centrado verticalmente de forma predeterminada. ¿Cómo puedo eliminar esto? Cómo alinear el contenido de la<button> verticalmente a la cima?

<table>
 <tbody>
 <td>
  <ul>
  <li>
   <button>
    <div>Content</div>

Tengo un ejemplo sobrejsFiddle.

button {
  display: block;
  position: relative;
  background-color: pink;
  width: 100%;
  min-height: 200px;
}

<button>
  <div>why?</div>
  <div>are these centered vertically?</div>
  <div>And how to remove it?</div>
</button>