Antd how to fixe the size of the multi selection component?

Question

I am using the Ant design components for React. I would like to fixe the size of the multi selection input fields in order to have the selected values into the same line without taking a new line like is the default behavior :

https://ant.design/components/select/#components-select-demo-multiple

I need to have the values ranged into the same line.

I can fixe the size of the input fields by overriding the style

.ant-select-selection--multiple:before, .ant-select-selection--multiple:after  {
display: inline !important;  }

But when I select several values, then they are outside the inputr field.

Answer 1

You can specify maxTagCount

 <Select
  mode="multiple"
  maxTagCount={1}
>
  // here is rendering of the Opitons
</Select>

Answer 2

Finally I found a solution by adding this css style options :

.ant-select-selection--multiple
{
   white-space: nowrap;
   height: 30px;
   overflow: auto
}

Thus the div is looking like an input text field and when the content ground a scroll appear at the right side of the div field.