0

DIV幅が 875 ピクセルのがあります。ページの左マージンから始まります。そのCSSクラスは

.three-column

    {
        width:875px;
        float:left;
    }

その中にDIV別のDIV. これDIVには、以下に説明するラベルとフィールドが含まれます。これらの DIV は、メイン コンテナーの左上隅から開始し、左から右に流れ、その後、次の行に進みます。これは、含まれている CSS で動作します。そのCSSクラスは

.LabelAndField
{
    width: 240px;
    margin-left:auto;
    float:left; 
}

フィールド (入力ボックス) の CSS は次のとおりです。

fieldset input[type="text"].editor-field-score
{
    border: 1px solid #cccccc;     
    font-size: 1.0em;
    font-weight: 600;   
    padding: 5px;
    margin-right : 20px;
    float : right;
    width : 50px;
    text-align: right;
}

ラベルのCSSはこちら

fieldset .editor-label-score 
{
    float:left;
    font-size: 1.0em;
    font-weight: normal;
    padding-right: 10px;
    margin :10px 0px 0px 0px;
    color: #9900CC;
    text-align: right;
}

LabelAndField DIV で入力ボックスを右揃えにしたい。次に、ラベルを入力ボックスに隣接させます。短いテキスト ラベルによる余分なスペースは、ラベルの左側に表示する必要があります。どうすればいいですか?

4

1 に答える 1

0

text-align: right; それを行いますが、これは children に適用され、要素自体には適用されません

fieldset .editor-label-score 
{
    float:left;
    font-size: 1.0em;
    font-weight: normal;
    padding-right: 10px;
    margin :10px 0px 0px 0px;
    color: #9900CC;
    text-align: right;
}

このようにするだけで結構です

<fieldset class="editor-label-score">
     <a>description of TxtBox</a>
</fieldset>
于 2012-11-07T21:38:01.477 に答える