CSSは表のセル内とページ全体を1つに統制します

Question

したがって、ページ上のすべての入力タイプのサイズを調整するCSSがあります。しかし、私はまだいくつかの長さの面で規制されていないことに気づいています。私が使っているCSSはこれです：あなたは、いくつかのマイナーな長さの問題が残っている見ることができるように

：ここ

.leftRightBorder select, 
.leftRightBorder textarea, 
.leftRightBorder input[type=text] 
{ 
    width: 150px; 
} 

上記のCSSを使用して、ページの写真です。しかし、私が持っている主な質問は、それぞれのコンポーネントの '支払日'と 'ロールデイ'フィールドが同じテーブルセル内にあるので、それらの間に
を置いても、間隔は他のすべての間の垂直スペーシングページ。ページ上のすべての項目の間には、どのように垂直方向に間隔を置いていますか？

EDIT：

ここでは、ASP.NETコード：

<tr id="tr63"> 
         <td id="td64"> 
          Payment Day 
         </td> 
         <td id="td65" class="leftRightBorder"> 
          <%= Html.DropDownListFor(m => m.FixedComponent.PaymentDay, DropDownData.DaysOfMonthList(), "", new { propertyName = "FixedComponent.PaymentDay", onchange = "UpdateField(this);" })%> 
          <%= Html.DropDownListFor(m => m.FixedComponent.PaymentBusinessDayConvention, DropDownData.BusinessDayConventionList(), "", new { propertyName = "FixedComponent.PaymentBusinessDayConvention", onchange = "UpdateField(this);" })%> 
         </td> 
         <td id="td66" /> 
         <td id="td67"> 
          Payment Day 
         </td> 
         <td id="td68" class="leftRightBorder"> 
          <%= Html.DropDownListFor(m => m.FloatingComponent.PaymentDay, DropDownData.DaysOfMonthList(), "", new { propertyName = "FloatingComponent.PaymentDay", onchange = "UpdateField(this);", disabled="disabled" })%> 
          <%= Html.DropDownListFor(m => m.FloatingComponent.PaymentBusinessDayConvention, DropDownData.BusinessDayConventionList(), "", new { propertyName = "FloatingComponent.PaymentBusinessDayConvention", onchange = "UpdateField(this);", disabled="disabled" })%> 
         </td> 
        </tr> 

私はHTMLヘルパーの間の間隔は、ページ上の他のすべての間隔を等しくしたいです。お役に立てれば。

Answer 1

パディングの代わりにマージンを調整してみてください。 input{margin-bottom: 5px;}パディングは境界の内側にあり、マージンは境界の外側です。

Answer 2

このためにhtmlを投稿できると便利です。 1つの方法として、フィールドにパディングを追加する方法があります。何が起こっているのかは、目に見えないテーブル境界があり、他のすべてのフィールド間にスペースを作成していることです（私は思う）。次に、同じテーブルフィールドに2つのフォームフィールドがある場合、境界線はありません。

最も簡単な解決法は、それらを別々のフィールドにすることです。 2つのフィールド間に浮動表示する必要がある場合は、「ロールデー」フィールドrowspan = "2"にすることができます。代わりに、あなたのCSSに次のような行を追加することもできます：

input{margin-bottom: 2px;} 

もちろん入力にも影響があり、おそらく最適なルートではありません。