我试图让div元素与“sidebar”类和div元素与“editorWindow”类在一个列中彼此相邻，但它不起作用。

<div className="mainWrap">
      <div className="sidebar">
         <div className="innerSidebar">
          <div className="sidebarLogo">
            <img src="/code-socket-light.png" className="sidebarLogo" alt="Sidebar Logo"/>
          </div>
          <h3>Connected Users</h3>
          <div className="userList">
            {
              users.map(eachUser => <User key={eachUser.socketId} username={eachUser.username}/>)
            }
          </div>
         </div>
         <button className="btn copyBtn">Copy Code Room ID</button>
         <button className="btn leaveBtn">Leave Code Room</button>
      </div>
      <div className="editorWindow">
        <Editor />
      </div>
    </div>

字符串
这是我使用的CSS

.mainWrap{
  display: grid;
  grid-template-columns: 230px 1fr;
}
.sidebar{
  background: #1c1e29;
  padding: 16px;
  color: #fff;
  display:flex;
  flex-direction: column;
}

型
出了什么问题？
我试图使用CSS网格显示“mainWrap”div中的两个div，但由于某种原因，它不起作用。