html - 幅を auto + 5px に設定するには?

Question

私はそれを知りたいのですが、このようなことは可能ですか? :

#test{
    background-color: red;
    width:auto + 5px;
}

<div>を、テキストの幅に正確に合わせたくありません。「『テキスト幅』+5px」にしたいです。

cssで可能ですか？

Answer 1

パディングを使用することをお勧めします：

#test {
    background-color: red;
    width:auto;
    padding:0 5px;
}

これにより、左右に 5px のパディングが作成されます。上下のパディングは 0 になります。

Answer 2

div の自動幅は 100% です。コンテンツの幅だけが必要な場合float: left/right

#test {
    float: left/right;
    background-color: red;
    padding-left: 5px;
    /* OR */
    padding-right: 5px;
}

Answer 3

パディングを使用します。

    #test{
        background-color: red;
        width:auto;
        padding: 0px 5px;
    }

Answer 4

などを実現したい場合は、などwidth:auto + 5pxのスタイルシート言語を使用する必要があります。sasscompass

テキストの周りに余分なスペースを入れたい場合は、以下のようにパディングを使用できます -

#test {
   padding:5px;  //for all top, right, bottom, left
    OR
   padding:5px 3px; //5px for top, bottom and 3px for left right
    OR
   padding:5px 3px  4px;  //5px for top, 3px for left and right and 4px for bottom
    OR
   padding: 5px 4px 3px 2px;  //goes this way, top-right-bottom-left
}