2021年1月1日星期五

How to make ant Layout design fit page

I am having a problem with using React and antd, I am using a component from the Layout page on antd. There is a comma that I believe is restricting the UI from filling out the page, although it might be somethign else to do with the design. What I am looking to fix is too have the UI fill the page instead of the height being restricted and having a comma below it.

UI screenshot

React Layout being rendered in App.js:

<Layout>              <Sider                  breakpoint="lg"                  collapsedWidth="0"                  onBreakpoint={broken => {                      console.log(broken);                  }}                  onCollapse={(collapsed, type) => {                      console.log(collapsed, type);                  }}              >                  <div className="logo"/>                  <Menu theme="dark" mode="inline" defaultSelectedKeys={['4']}>                      <Menu.Item key="1" icon={<UserOutlined/>}>                          nav 1                      </Menu.Item>                      <Menu.Item key="2" icon={<VideoCameraOutlined/>}>                          nav 2                      </Menu.Item>                      <Menu.Item key="3" icon={<UploadOutlined/>}>                          nav 3                      </Menu.Item>                      <Menu.Item key="4" icon={<UserOutlined/>}>                          nav 4                      </Menu.Item>                  </Menu>              </Sider>              <Layout>                  <Header className="site-layout-sub-header-background" style=/>                  <Content style=>                      <div className="site-layout-background" style=>                          content                      </div>                  </Content>                  <Footer style=>Ant Design ©2018 Created by Ant UED</Footer>              </Layout>          </Layout>  

I am very confused as to why there is a comma there if anyone has some suggestions any advice would be appreciated.

https://stackoverflow.com/questions/65535119/how-to-make-ant-layout-design-fit-page January 02, 2021 at 08:53AM

没有评论:

发表评论