在d弯曲时不能向右和向左移动

Question

我有一个问题，正如你在下面的图片中所看到的，我希望1在左边，2在右边。我的密码怎么了？

​

​

<div className="mt-5 mx-5 py-3 shadow bg-white">
  <div className="d-flex justify-content-center">
    <div style={{ float: "left", display: "flex" }}>
      <div className="p-2">1</div>
    </div>
    <div className="p-2 me-4">Popular Products</div>
    <div className="p-2">Low Prive</div>
    <div className="p-2 ms-4">High Price</div>
    <div style={{ float: "right", display: "flex" }}>
      <div className="p-2">2</div>
    </div>
  </div>
</div>

Answer 1

​

您需要使用对齐内容之间的

    <div className="mt-5 mx-5 py-3 shadow bg-white">
            <div className="d-flex justify-content-between">
                <div>
                    <div className="p-2">1</div>
                </div>

                <div className="d-flex justify-content-center w-100">
                    <div className="p-2 me-4">Popular Products</div>
                    <div className="p-2">Low Prive</div>
                    <div className="p-2 ms-4">High Price</div>
                </div>

                <div>
                    <div className="p-2">2</div>
                </div>
            </div>
        </div>