将一个按钮放在TextBox总长度为100%的旁边

Question

当Button具有给定宽度(通过它的值)并且Parent div也具有给定宽度时,是否可以在TextBox旁边放置一个Button.最后,TextBox宽度+按钮宽度应该是父div的宽度.

TestExample:

#left
{
    float: left;
    width: 100%;
}
#right 
{
    width: auto;
}

<div>
    <input type="text" id="left"/>
    <input type="button" id="right" value="AnyText"/>
</div>

谢谢!

Answer 1

form { display: flex; }
input[type=text] { flex-grow: 1; }

<form>
  <input type="text">
  <input type="button" value="Button text">
</form>