Пусть textarea определяет высоту строки таблицы - PullRequest
0 голосов
/ 05 февраля 2020

У меня есть текстовая область и многострочный текст в таблице в двух разных столбцах. Размер текстовой области можно изменять, и поэтому я хочу, чтобы текстовая область определяла высоту таблицы и многострочного текста так же высоко, как текстовая область (переполняющая все, что не может быть отображено).

Проблема в том, что я очевидно, не может установить фиксированную высоту для прокручиваемого текста, но если я этого не сделаю, он занимает все пространство и не переполняется.

Это не позволит мне установить высоту tr, и я попытался всевозможные варианты отображения и высоты.

Есть ли способ выполнить sh это?


Вот рабочий пример того, с чем я работаю:

td,
td {
  border: 2px solid black;
}

.scrollable {
  overflow: auto;
  //height: 50px;
}
<table>
  <tbody>
    <tr>
      <td><textarea></textarea></td>
      <td>
        <div class="scrollable">
          this is some really really really really really<br> really really really really really really really<br> really really really really really really really<br> really really really really really really really<br> really really really really really
          really really<br> really really really really really really really<br> really really really really really really really<br> really really really really really really really<br> long content
        </div>
      </td>
    </tr>
  </tbody>
</table>

Ответы [ 2 ]

0 голосов
/ 05 февраля 2020

Как это? Это делает внутренний текст заданной высотой c, а затем прокручивается этот блок:

td, td {
    border: 2px solid black;
}

.scrollable {
  overflow: auto;
  height: 20px;
}
.inner{
  top: 0px;
  height: 20px;
}
<table>
      <tbody>
        <tr>
          <td><textarea></textarea></td>
          <td  class="scrollable">
            <div class="inner">
              this is some really really really really really<br>
              really really really really really really really<br>
              really really really really really really really<br>
              really really really really really really really<br>
              really really really really really really really<br>
              really really really really really really really<br>
              really really really really really really really<br>
              really really really really really really really<br>
              long content
            </div>
          </td>
        </tr>
      </tbody>
    </table>
0 голосов
/ 05 февраля 2020

Вы можете использовать что-то вроде

 <textarea rows="4" cols="50">
 Your content for example
 </textarea> 
...