1
私のページにはテーブルがあります。選択に応じて、私はテーブルに4または5行を持つことができます。 4行か5行のどちらの行の高さであっても、一番上の行の高さを正確にしたい。現在、私のテーブルに4つの行があると、最上位の行のサイズが大きくなります。同じ高さで一番上の行を毎回作る方法は?ここでHTMLテーブル内の行の動的な高さ
が私のテーブルです:
<table style="vertical-align:top; border-width:1px; border-style:solid; width:565px; height:155px; color:Black; font-size:8pt; left:19%; top:0px; position:absolute; border-color:Blue;">
<tr style="height:30px;">
<td align="left" style="width:190px; font-size:9pt; font-weight:bold; height:30px;"> @(Model.PlanSummary.Header)</td>
<td style="background-color:Red; width:130px; color:White; text-align:center; height:30px;">@(Model.PlanSummary.PlanTypes_1)</td>
<td align="center" style="background-color:Red; width:130px; color:White; height:30px; text-align:center; height:30px;">@(Model.PlanSummary.PlanTypes_2)</td>
<td align="center" style="background-color:Red; width:130px; color:White; height:30px; height:30px;">@(Model.PlanSummary.PlanTypes_3)</td>
</tr>
@{
if(planName == "Business User")
{
<tr style="font-size:7pt;">
<td align="left" style="width:190px;"> @(Model.PlanSummary.PlanUsersHeader) </td>
<td align="center" style="width:120px;"> @(Model.PlanSummary.PlanUsersDetail1) </td>
<td align="center" style="width:120px;"> @(Model.PlanSummary.PlanUsersDetail2) </td>
<td align="center" style="width:120px;"> @(Model.PlanSummary.PlanUsersDetail3) </td>
</tr>
}
}
<tr style="font-size:7pt;">
<td align="left" style="width:190px;"> @(Model.PlanSummary.PlanPriceHeader)</td>
<td align="center"> @(Model.PlanSummary.PlanPriceDetail1) </td>
@{
if(planName == "Business User")
{
<td align="center" style="width:120px; font-size: 9pt;">
@Html.DropDownList("RPUserPricingList", (IEnumerable<SelectListItem>)Model.PlanSummary.UserPricingList, new { style = "font-family: Verdana; font-size: 6pt; text-align:center; width:100px;" })
</td>
<td align="center" style="width:120px; font-size: 9pt;">
@Html.DropDownList("RPCompanyPricingList", (IEnumerable<SelectListItem>)Model.PlanSummary.ComanyPricingList, new { style = "font-family: Verdana; font-size: 6pt; text-align:center; width:90px;" })
</td>
}
else
{
<td align="center"> @(Model.PlanSummary.PlanPriceDetail2) </td>
<td align="center"> @(Model.PlanSummary.PlanPriceDetail3) </td>
}
}
</tr>
<tr style="font-size:7pt;">
<td align="left" style="width:190px;"> @(Model.PlanSummary.PlanUnitCountHeader)</td>
<td align="center"> @(Model.PlanSummary.PlanUnitCountDetail1) </td>
<td align="center"> @(Model.PlanSummary.PlanUnitCountDetail2) </td>
<td align="center"> @(Model.PlanSummary.PlanUnitCountDetail3) </td>
</tr>
<tr>
<td></td>
@{
if(planName == "Personal")
{
<td align="center"><button style="background-image:url('Content/Images/ShortRedButton.png');color:White;width:86px;height:24px;font-size:6pt;">@(Model.PlanSummary.Btn1)</button></td>
<td align="center"><button style="background-image:url('Content/Images/ShortRedButton.png');color:White;width:86px;height:24px;font-size:6pt;">@(Model.PlanSummary.Btn2)</button></td>
<td align="center"><button style="background-image:url('Content/Images/ShortRedButton.png');color:White;width:86px;height:24px;font-size:6pt;">@(Model.PlanSummary.Btn3)</button></td>
}
else
{
<td align="center"><button style="background-image:url('Content/Images/ShortRedButton.png');color:White;width:86px;height:24px;font-size:6pt;">@(Model.PlanSummary.Btn1)</button></td>
<td align="center"><button style="background-image:url('Content/Images/ShortRedButton.png');color:White;width:86px;height:24px;font-size:6pt;">@(Model.PlanSummary.Btn2)</button></td>
<td align="center">
<button style="background-image:url('Content/Images/LongRedButton.png');color:White;width:96px;height:26px;font-size:6pt;">@(Model.PlanSummary.Btn3)</button>
<br />
<button style="background-image:url('Content/Images/LongRedButton.png');color:White;width:96px;height:26px;font-size:6pt;">@(Model.PlanSummary.Btn4)</button>
</td>
}
}
</tr>
</table>
テーブルdefから高さ要素を削除しました。それは働いた。 –
これを答えとして追加し、それを受け入れます。あなた自身の質問に答えることだけではなく、励まされます。答えはコメントよりも見るのが簡単です。さらに、それは解決されたようにマークされ、「未回答」リストには表示されません。 – ThinkingStiff
となります。ありがとう!!!! –