Giters

pablof7z / chardin.js

Simple overlay instructions for your apps.

Home Page:https://heelhook.github.io/chardin.js/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

White line overlaps a button that doesn't have any text

craigbroadman opened this issue · comments

commented

If you use a button without any text (e.g. use the dev tools in chrome to remove the text from the "See it in action" button on http://heelhook.github.io/chardin.js/) and then show the overlay - the white line isn't positioned correctly - see attachment

How can I get around this?

image

--- Want to back this issue? **[Post a bounty on it!](https://www.bountysource.com/issues/26354902-white-line-overlaps-a-button-that-doesn-t-have-any-text?utm_campaign=plugin&utm_content=tracker%2F283283&utm_medium=issues&utm_source=github)** We accept bounties via [Bountysource](https://www.bountysource.com/?utm_campaign=plugin&utm_content=tracker%2F283283&utm_medium=issues&utm_source=github).
commented

Hi, is there any update on this? Does anyone know the answer?

commented

I have looked in to this in further detail and this effect is seen on any element that is less than 65 pixels wide.

I have managed to work around the issue by appending a "chardin-js-small-{0}" class (where {0} is the width of the element) to the tooltip_layer element when the element is less than 65px wide.

I have then used LESS to override the width/top/left/right styles