I am facing a challenge of adding space between two input fields without resorting to the use of  . I attempted to insert {' '} but saw no change in the render.
This is how they appear when rendered:
return (
<div className="side-by-side">
<Input
style={{ marginRight: 100 }}
classname="flex w-49"
label="first name"
type="text"
placeholder="Enter first name..."
inputId="basicInput"
value={obj.firstName}
></Input>
{' '}
<Input
classname="flex w-49"
label="last name"
type="text"
placeholder="Enter last name..."
inputId="basicInput"
value={obj.lastName}
></Input>
</div>
Below is the CSS utilized to align them on the same line:
.side-by-side {
display: flex;
flex-direction: row;
align-items: center;
margin-left: 4px; //also tried to add a margin but that didn't work
}