search

chinchang / hint.css

A CSS only tooltip library for your lovely websites.
https://kushagra.dev/lab/hint/
MIT License
8.42k stars 701 forks source link

Hidden hint makes website wider #139

Open dvorapa opened 8 years ago

dvorapa commented 8 years ago

Website is wider and therefore (especially on small screens) there is a white strip and horizontal scrollbar. See screenshot below image

tnrich commented 7 years ago

I am also seeing this error and it is super annoying

chinchang commented 7 years ago

Since this is happening because of the tooltip going beyond the website boundaries, there are following solutions I can think of:

  1. Quick fix - Choose another tooltip position such that it doesn't extends in the direction (right & bottom) where its increasing the website dimensions.
  2. Quick fix - Limit body to max 100vw assuming it never scrolls horizontally. And then you can use overflow:hidden to not let anything. Note that this will crop the tooltip though.
  3. Better fix - Hint.css could have media query classes that allow you to position tooltips in a certain way on a certain screen size. This is essentially supporting the above mentioned solution 1 within the library in a more proper way. (there is also a PR in this context)