jqueryプラグイン「responsive-tables」で、改行しても表示が崩れないようにしたい

やりたい事

横に長いテーブルをスマホ表示でもかっこよく表示させる為に、
左列を固定、その為に、jqueryのプラグインを使っています。

うまく表示はできているのですが、
セルの中で改行を入れた時、
固定列と、可変する列と、
高さが異なってしまいます。

使ってるプラグイン

https://zurb.com/playground/responsive-tables

ソース

<!DOCTYPE html>
<html lang="jp">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>テーブルテスト</title>
  <link rel="stylesheet" href="https://zurb.com/playground/projects/responsive-tables/responsive-tables.css">

<style>
table{
  border-collapse: collapse;
  border-spacing: 0;
}
td, th{
  border: 1px solid gray;
}

</style>

  <script src="https://zurb.com/playground/projects/responsive-tables/javascripts/jquery.min.js"></script>
  <script src="https://zurb.com/playground/projects/responsive-tables/responsive-tables.js"></script>

</head>
<body>

  <table class="responsive">
    <tr>
    <th>Header 1</th>
    <th>Header 2</th>
    <th>Header 3</th>
    <th>Header 4</th>
    <th>Header 5</th>
    <th>Header 6</th>
    <th>Header 7</th>
    <th>Header 8</th>
    </tr>
    <tr>
    <td>row 1, cell 1</td>
    <td>row 1, cell 2</td>
    <td>row 1, cell 3</td>
    <td>row 1, cell 4</td>
    <td>row 1, cell 5</td>
    <td>row 1, cell 6</td>
    <td>row 1, cell 7</td>
    <td>row 1, cell 8</td>
    </tr>
    <tr>
    <td>row 2, cell 1<br />改行</td>
    <td>row 2, cell 2</td>
    <td>row 2, cell 3</td>
    <td>row 2, cell 4</td>
    <td>row 2, cell 5</td>
    <td>row 2, cell 6</td>
    <td>row 2, cell 7</td>
    <td>row 2, cell 8</td>
    </tr>
    <tr>
    <td>row 3, cell 1</td>
    <td>row 3, cell 2</td>
    <td>row 3, cell 3</td>
    <td>row 3, cell 4</td>
    <td>row 3, cell 5</td>
    <td>row 3, cell 6</td>
    <td>row 3, cell 7<br />改行</td>
    <td>row 3, cell 8</td>
    </tr>
    <tr>
    <td>row 4, cell 1</td>
    <td>row 4, cell 2</td>
    <td>row 4, cell 3</td>
    <td>row 4, cell 4</td>
    <td>row 4, cell 5</td>
    <td>row 4, cell 6</td>
    <td>row 4, cell 7</td>
    <td>row 4, cell 8</td>
    </tr>
  </table>

</body>
</html>

コードペン

試した事

調べまくった

m.ts10806

2018/08/28 10:52

「調べまくった」ではどういう方向性で調べたのかとか誰も分かりませんよ。参考にしたURLとか試したコードとか具体的に提示してください。

Tatsurou

2018/08/29 01:27

いります？ググったワードくらいっすよ？

m.ts10806

2018/08/29 01:34

検索の仕方に余程の自身があれば別に構いませんが、探し方が良くないと出てくるものも出てきません。ただ、どう探したか書かれていないのでその判断は誰にもできません。たまに実は解決につながる記事がヒットしているのにスルーしてしまったりそういう惜しい人もいます。調べただけで何も試してなければそれは調べたとは言えません。「調べまくった」だけではどの段階なのか判断が不可能なわけです。

m.ts10806

2018/08/29 01:35

それに「試した事」の項目に「調べまくった」ではQに対するAにはなってませんよね。

Tatsurou

2018/08/29 01:37

何故、提示する必要があるのか教えて頂けないでしょうか。ググって記事読んで、ギブ(アップ)って事です。つまり、僕の中でのタイムアウトって事で質問したのですが。僕が回答者なら、そんな情報いらないという考えです。ケースバイケースではありますが、今回のって、javascript弱い僕がプラグイン使って、アタフタって事ですよね。また、試した事って、「あーそれね！」ってなるのは良いかもしれませんが、その「頑張りました」的な有益でない情報って、無駄にスクロールさせる気がしますが如何でしょうか。アップルのコールセンターであれこれ、質問されるのと同じ気持ちになりました。

Tatsurou

2018/08/29 01:48

確かにそうですね。。項目自体いらなかったです、、stackflowなども見てはいるんですが、、僕みたいな初心者はググったら0.5時間以上かかる場合があるので、どういう検索キーワードで調べたなどは、載せるようにします。

m.ts10806

2018/08/29 01:53 編集

回答する側になればわかると思いますが、回答者も結局何かしら調べて回答することが多いです。で、調べて「これで出来そう」という情報があればリンクを提示しますよね。で「それ見ました」って言われたらお互い二度手間三度手間になるわけです。質問をメインでされている方は特に調べ方良くなかったり、調べていても情報をきちんと読み取れていなかったりすることが非常に多いです。でも、それは「どう調べて何を試したか」を質問者さんしか持っていないと、その二度手間三度手間が発生するわけです。「質問するときのヒント」にも書いてありますよ。https://teratail.com/help/question-tips#questionTips1-2 特に黄色くなっている部分ですね。「タイムアウト」は”小休止”なので使い方間違っているとは思うのですが、あなたの中でギブアップだとしても見ている人はそのような状況を全く知らない人たちです。その人たちに自身の状況を説明すること、質問内容を充実することは解決を早めます。コールセンターであれこれと仰っていますが別に普通ですよ。職場の先輩に「調べたけどダメでした」って聞いたら「どう調べて何やったの？」って聞かれますよね。それと同じことです。長くなりましたが、「調べまくった」だけでは非推奨である「丸投げ」とそう変わりません。現在付いている回答も何かしらの良い角度で調べたから出てきた情報かもしれません。「どのように調べたか」気になりませんか？自身の調べ方を見直さないと今後何も解決しませんよ。丸投げて低評価くらってそのうち誰も回答しなくなります。

m.ts10806

2018/08/29 01:52

ちょっと言い過ぎました。余り気を悪くしないでください。なんとか解決にもっていけたらと思い、そのためには質問内容の充実が不可欠（あとその後の質問者さんの成長も不可欠）と思った次第です。既にこの質問は解決されていますが、今後何か回答できそうなものがあればコメントさせていただくこともあるかと思います。

Tatsurou

2018/08/29 01:57

いえ、僕が素直でなかっただけです。失礼しました。「質問するときのヒント」読みました。参考になりました。また、自分が回答者になった時という考えが抜けているなと反省しております。「丸投げ」はよくないですよね。自分だけが時間がない訳ではないってことを忘れておりました。今回のご指摘で今後、僕の質問の質が改善できる気がします。ありがとうございました。今後、何かあれば、よろしくお願いいたします。

m.ts10806

2018/08/29 01:59

ちょっと厳しく言ってしまって私も反省しています。聞き入れていただきありがとうございます。よろしくお願いします。・