9

実際の例: http://jsfiddle.net/yDQXG/

Chrome で見たもの: http://i.imgur.com/shLfA.png

入力要素 (青いフィールド) の周りの間隔がどこから来ているのかわかりません。何か案は?

<form method="get">
<fieldset class="halfblock">
    <input class="blockheader" type="text" value="Field A">
    <textarea class="blocktext" rows="5">Line 1&#13;&#10;Line 2</textarea>
</fieldset>
</form>
4

4 に答える 4

7

インライン要素だからです。画像でも同じことがよく起こります。

display:block入力に追加するだけです。

input.blockheader {
    margin: 0;
    padding: 0;
    text-align: center;
    background: #ABD9E2;
    font: 11px/11px 'Vollkorn', serif;
    border: none;
    width: 100%;
    position: relative;
    /* top: -7px; */

    display: block;
}
于 2012-11-17T18:24:37.100 に答える
6

行の高さを設定: 0px; .halfblock で

.quote_body .halfblock {
    width: 262px;
    border: 1px dotted 
    #333;
    float: left;
    margin-bottom: 15px;
    line-height: 0px;
}
于 2012-11-17T18:21:49.633 に答える
3

入力の CSS に表示タグを追加します。

input.blockheader {
    display: block;
}

問題が解決しました。

于 2012-11-17T18:23:50.673 に答える
0

設定:

.halfblock & . thirdblock へ:

line-height:0px

CSSリセットを追加するオプションも検討してください

http://meyerweb.com/eric/tools/css/reset/

于 2012-11-17T18:24:48.980 に答える