GithubHelp home page GithubHelp logo

scrollbar covers menu icons about pell HOT 6 CLOSED

jaredreich avatar jaredreich commented on August 24, 2024 9
scrollbar covers menu icons

from pell.

Comments (6)

jaredreich avatar jaredreich commented on August 24, 2024 2

Thanks everyone for reporting and commenting, fixed in 722308c

from pell.

joebubna avatar joebubna commented on August 24, 2024

I just encountered the same thing on Chrome 58.0.3029.110 (64-bit), running on a Mac.

from pell.

RichiCoder1 avatar RichiCoder1 commented on August 24, 2024

It's because it should be overflow-x: auto rather than overflow-x: scroll.

from pell.

tutman96 avatar tutman96 commented on August 24, 2024

Wouldn't that also cover the buttons if it needed the scrollbar? like on mobile?

from pell.

brooksbecton avatar brooksbecton commented on August 24, 2024

Looks like the class .pell-actionbar has a fixed height of 30px. I changed the height to 10% in chrome debug and that helped with cover up.

Also adding @RichiCoder1 'overflow-x: auto' helped the full screen from having a extraneous toolbar.

Windows 10 Version 61.0.3150.0 (Official Build) canary (64-bit)

from pell.

CodeBrauer avatar CodeBrauer commented on August 24, 2024

This problem appears on any OS that has always-visible scrollbars (e.g. current macOS on default settings doesn't).

I think this is intended to work like this on macOS / mobile:
gif

As mentioned by @RichiCoder1 this can be solved by changing overflow-x from scroll to auto: pell.scss

However on viewports < ~480px the issue will appear again (on any OS that has always-visible scrollbars)


Related #7 #9

from pell.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.