Wie kann ein Eingabeelement die verbleibende Breite seines Containers ausfüllen?

So formatieren Sie ein Eingabeelement so, dass es an die verbleibende Breite seines Containers passt

Sie können häufig auf Situationen stoßen, in denen Sie ein Eingabeelement neben einer Beschriftung innerhalb eines festen Bereichs haben. Breite Container. Das Ziel besteht darin, dass das Eingabefeld seine Breite dynamisch anpasst, um den verbleibenden Platz auszufüllen, ohne dass es zu Zeilenumbrüchen kommt.

CSS-Lösung

<br>form {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">width: 500px;
overflow: hidden;
background-color: yellow;

Nach dem Login kopieren

}
Eingabe-{

width: 100%;

}
Span-{

display: block;
overflow: hidden;
padding-right:10px;

}
Schaltfläche {

float: right;

}

<br><form method="post"></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"> <button>Search</button>
 <span><input type="text" title="Search" /></span>

Nach dem Login kopieren