How to align the drop right
Closed this issue · 7 comments
What is the best way to right align the drop, need this for a selectbox close to the rightside of the screen.
I tried it by replacing self.drop.style.left = self.left + "px"; by:
var caretright = document.getElementById("btn-group-" + self.domSelector).getElementsByClassName("caret")[0].getBoundingClientRect().right;
self.drop.style.float = "right";
self.drop.style.left = null;
self.drop.style.right = window.innerWidth - caretright - 10 + "px";
But maybe there is a better way.
That's a problème I will try to fix :
in vanillaSelectBox.css if you get rid of position:fixed; in .vsb-menu, you will be free to put the select box where you want but the select when open, will push the dom downwards ! I will try to fix it whenever I can
I have fixed a major issue : on page scroll or resize, the menu did not stay at the right place !
so with this new version you should be able to just set the style of the div where you put the select tag to "text-align:right;" the left align in the menu willl be preserved and be displayed normally.
Tell me if it solves your problem.
Thank you helping me make vanillaSelectBox better !
Thanks for looking into this.
The last fix has a problem when you have a large list(e.g. all countries) and the menu has a scrollbar, you can't scroll in the list.
And a little typo on line 252: if(!this.userOptions.stayOpen ){ must be if(!self.userOptions.stayOpen ){
I have corrected the "typo" (kind of you, I would call it a bug!)
and made a demo with all countries in the world
https://philippemarcmeyer.github.io/vanillaSelectBox/
(empty you cache)
it works for me with in Chrome Version 79.0.3945.79 (Build officiel) (64 bits)
Could you test ?
You're right, it works in the demo, must be something in my own code
If I can help you : give me your code by mail or somewhere in the cloud :-)
No news good news. I close this issue