こちらからアクセスできるアプリケーションがあります。アプリケーションを開くと、プラス ボタンをクリックするだけで、モーダル ウィンドウに検索バーが表示されます。
次の 2 つの検索を行ってください。
検索 1: AAA
検索 2:AAE
AAE 検索ではテーブルが全幅に表示されますが、AAA 検索を行うと、テーブルの幅はかなり小さくなります。
テーブルの幅を常に 100% に固定したい (小さくしたくない) のですが、これを行う方法がわかりません。
要件を満たすために、以下のコードをどのように修正できますか?
以下は、テーブルをエコーする php コードです。
$output = "";
$output .= "
<table border='1' id='resultbl'>
<tr>
<th id='questionth'>Question</th>
<th id='optiontypeth'>Option Type</th>
<th id='noofanswersth'>Number of <br/> Answers</th>
<th id='answerth'>Answer</th>
<th id='noofrepliesth'>Number of <br/> Replies</th>
<th id='noofmarksth'>Number of <br/> Marks</th>
</tr>
";
while ($questionrow = mysql_fetch_assoc($questionresult)) {
$output .= "
<tr>
<td id='questiontd'>{$questionrow['QuestionContent']}</td>
<td id='optiontypetd'>{$questionrow['OptionType']}</td>
<td id='noofanswerstd'>{$questionrow['NoofAnswers']}</td>
<td id='answertd'>{$questionrow['Answer']}</td>
<td id='noofrepliestd'>{$questionrow['ReplyType']}</td>
<td id='noofmarkstd'>{$questionrow['QuestionMarks']}</td>
</tr>";
}
$output .= " </table>";
echo $output;
以下は完全な css コードです: すべての列見出しと行は中央に配置され、最小幅と最大幅があり、テーブル自体の最小幅と最大幅は 100% です。
#questionth{
min-width:35%;
max-width:35%;
text-align:center;
}
#optiontypeth{
min-width:15%;
max-width:15%;
text-align:center;
}
#noofanswersth{
min-width:10%;
max-width:10%;
text-align:center;
}
#answerth{
min-width:20%;
max-width:20%;
text-align:center;
}
#noofrepliesth{
min-width:10%;
max-width:10%;
text-align:center;
}
#noofmarksth{
min-width:10%;
max-width:10%;
text-align:center;
}
#questiontd{
min-width:35%;
max-width:35%;
text-align:center;
}
#optiontypetd{
min-width:15%;
max-width:15%;
text-align:center;
}
#noofanswerstd{
min-width:10%;
max-width:10%;
text-align:center;
}
#answertd{
min-width:20%;
max-width:20%;
text-align:center;
}
#noofrepliestd{
min-width:10%;
max-width:10%;
text-align:center;
}
#noofmarkstd{
min-width:10%;
max-width:10%;
text-align:center;
}
#resulttbl{
min-width:100%;
max-width:100%;
}