HTML要素を含む全幅::セレクタ

-1

前には、だから私は、このサンプルコードを持っています。しかし、::beforeセレクタのコンテンツは、input要素とは別の行にあります。HTML要素を含む全幅::セレクタ

¿::beforeセレクタを含む100％幅の要素を使用するにはどうすればよいですか？ 95％の幅を使って回避策を講じました。しかし、エレガントなソリューションではありません。

出典

2016-09-29 Victor Casado

あなたは幅の完全なコード... –

使用カルク（）を投稿できます。あなたの前の幅が25ピクセルの場合： '.element-class {width：calc（100％ - 30px）;} // 5pxの間隔は' –

です。 –

フレックスボックスでも可能です。

span.element-class { 
 
    display: flex; 
 
} 
 
span.element-class input { 
 
    flex: 1; 
 
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" /> 
 
<span class="element-class fa fa-search"><input type="text"></span>

出典

2016-09-29 14:48:20

HTML要素を含む全幅::セレクタ

答えて

関連する問題