0

として知られているテーブルセルに収まるテキストエリアがあります.question。今私が抱えている問題は、テーブル セルの高さが増加した高さに拡張された場合、テキストエリアの高さが増加せず、テーブル セルの上部境界線とテキストエリア境界線の上部の間にギャップが残り、ギャップが残ることです。テキストエリアの下枠と表セルの下枠の間。

テーブル セルの高さが十分に減少すると、テキストエリアがテーブル セルの高さを埋めたように見えます。

しかし、私の質問は、テーブル セルの高さが変更されても、テキストエリアは常にテーブル セルの高さを埋める必要があるということです。私の質問は、これを行うために以下のcss、HTML、およびjqueryを変更するにはどうすればよいですか?

CSS:

    .question { 
        max-width:0.1%;
        border:1px black solid;
        border-collapse:collapse;
        line-height: 0;
    }

    .question textarea {
        width:auto;
        resize:none;
        height:100%;
        font-size:100%;
        display: block; 
        overflow:auto;

    }

Jクエリ:

function setWidth() {
    var questionCellHeight = $("#qandatbl_onthefly tbody .question").height();
    $(".textAreaQuestion").css({
        "height": (questionCellHeight) + "px"
    });
}

HTML テーブル:

<table id="qandatbl" align="center" cellpadding="0" cellspacing="0" border="0">
<thead>
<tr>
    <th class="question">Question</th>
</tr>
</thead>
</table>
<div id="qandatbl_onthefly_container">
<table id="qandatbl_onthefly" align="center" cellpadding="0" cellspacing="0" border="0">
<tbody>
<tr class='optionAndAnswer' align='center'>
<td class='question'>
<textarea class='textAreaQuestion'></textarea>
</td>
</tr>
</tbody>
</table>

アップデート：

高さ属性を変更.question textareaして削除したcssのわずかな更新：.textAreaQuestion

.textAreaQuestion{
    resize:none;
    font-size:100%;
    display: block; 
    overflow:auto;
}

テーブルセルが増加した場合、テキスト領域の高さがテーブルセルの増加と同じ高さに増加するように、jqueryを編集する必要があると思います。（意見）

4

1 に答える 1

1

$(".gridBtns").click(setWidth);jQuery 関数を再度呼び出すだけの場合は、Grid を処理するものに次のようなものを追加してみてください。

情報が多すぎるか少なすぎるため、何を必要としているのか正確にはわかりません。問題を絞り込んで、その問題だけを jsfiddle に入れるようにしてください。前に頼まれた時は逆だった。問題を再現するためにコードを追加し続けました。

tablesちなみに、レイアウト用の使用はやめてください。それdivsが目的です。

于 2012-12-28T15:48:15.740 に答える