<br>标记不能在元素之间反应js中工作。

Question

在下面的代码中，<br>标记不起作用。我在vscode工作，开发reactjs应用程序。

function Main()
{
    return(
    <>
        <div className="d-flex justify-content-center">
            <label for="height" className="text-info bg-secondary display-6" style={{marginRight: "40px",height:"50px"}}>
                Your Height:
            </label>
            <input type="text" id="height" placeholder="Centemeters"></input>

             <br /> /*This Tag is not working*/
             
            <label  className="text-info bg-secondary display-6" for="weight">
               Your Weight   /*this statement is showing side by side with above ones*/
            </label>
            <input type="text" id="weight" placeholder="KG"></input>
        </div>
    </>
    );
}

Answer 1

这是因为在包含元素的容器上有显示: flex；。

<div className="d-flex justify-content-center">