Custom control width when flex css style used-CodePudding

I custom control has a text box and a icon next to the text box

return (
        <div className="useFlex">
           <TextInput>

           </TextInput>
           <div>
              <Icon></Icon>
           </div>
        </div>)

.useFlex
{
   display:flex;
}

It works perfectly

But the issue is : when I use this custom control in my page, text box width is not getting expanded and it remains fixed.

<Table width="100%">
   <tr>
      <td><MyCustomControl> </MyCustomControl></td>
   </tr>
</Table>

could you please tell me what I am missing here?

CodePudding user response：

Try to add

.useFlex
{
   display:flex;
   flex-grow: 1;
}