Normalmente, as pessoas tentam descobrir como centralizar verticalmente as coisas. Quero remover uma instância do conteúdo centralizado e alinhar, e estou preso.

O conteúdo do botão (colocado em uma lista em uma célula da tabela) é centralizado verticalmente por padrão. Como posso remover isso? Como alinhar o conteúdo do<button> verticalmente para o topo?

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

Eu tenho um exemplo emjsFiddle.

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>