Comment faire en sorte qu'un élément d'entrée remplisse la largeur restante de son conteneur ?

Comment styliser un élément d'entrée pour l'adapter à la largeur restante de son conteneur

Vous pouvez souvent rencontrer des situations dans lesquelles vous avez un élément d'entrée à côté d'une étiquette dans un format fixe. conteneur de largeur. L'objectif est que le champ de saisie ajuste dynamiquement sa largeur pour remplir l'espace restant sans provoquer de sauts de ligne.

Solution CSS

<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;

Copier après la connexion

}
entrée {

width: 100%;

}
span {

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

}
bouton {

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>

Copier après la connexion