Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

react-grid-system Hidden and Visible don't work #165

Open
kepamuk opened this issue Feb 3, 2021 · 1 comment
Open

react-grid-system Hidden and Visible don't work #165

kepamuk opened this issue Feb 3, 2021 · 1 comment

Comments

@kepamuk
Copy link

kepamuk commented Feb 3, 2021

Hidden and Visible do not work in device toolbar.

this is visible a block and all Hidden are hidden if not included device toolbar
enter image description here

but if you enable device toolbar then they are still displayed
enter image description here

And if you move the width of the screen in the device toolbar mode, they will disappear, but when the page is refreshed, it still appears, what is the reason?

  <section className="Panel">
        <Container>
          <Row>
            <Col xl={3} lg={4} md={4}>
              <div className="Panel__logo">
                <img className="Panel__logo-burger" src="/static/svg/Panel__burger.svg" alt=""/>
                <img className="Panel__logo-ONLINE_BOOKMAKERS" src="/static/svg/Panel__ONLINE_BOOKMAKERS.svg" alt=""/>
              </div>
            </Col>
            <Visible sm xs>
              <Col xl={6} lg={5} md={5}>
asddddddddddddddddddd
              </Col>
            </Visible>
            <Visible md lg xl xxl>
              <Col xl={6} lg={5} md={5}>
                <div className="Panel__search">
                  <input className="Panel__search-input" type="text" placeholder="Найти букмекера, игру или ставку"/>
                  <div className="Panel__search-icon"/>
                </div>
              </Col>
            </Visible>
            <Hidden sm xs>
              <Col lg={3} md={3}>
                <div className="Panel__menu">
                  <ul className="Menu">
                    <li className="Menu__item">
                      <img src="/static/svg/Panel__menu1.svg" alt=""/>
                    </li>
                    <li className="Menu__item">
                      <img src="/static/svg/Panel__menu2.svg" alt=""/>
                    </li>
                    <li className="Menu__item">
                      <img src="/static/svg/Panel__menu3.svg" alt=""/>
                    </li>
                    <li className="Menu__item">
                      <img src="/static/svg/Panel__menu4.svg" alt=""/>
                    </li>
                  </ul>
                  <div className="Panel__menu-language"/>
                </div>
              </Col>
            </Hidden>
          </Row>
        </Container>
      </section>
@cristinaITdeveloper
Copy link

I have the same problem using <Hidden xs>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants