So I forgot to take this into account -
https://i.imgur.com/yn6oOcH.jpg
When you type something in the search bar, if it finds something a text appears, and if it doesn't find something a text appears. And when it appears it just takes up space there moving everything to the right of it further to the right, and making my close button go off the page. Son of a b**ch!!!
So I got this going now:
Code: Select all
[anonid="findbar-textbox-wrapper"] { -moz-box-ordinal-group: 4 !important; margin-left: 60px !important; }
.findbar-closebutton { -moz-box-ordinal-group: 2 !important; margin-left: 880px !important;}
.findbar-highlight { -moz-box-ordinal-group: 1 !important; }
.findbar-case-sensitive { -moz-box-ordinal-group: 0 !important; }
.findbar-entire-word { -moz-box-ordinal-group: 0 !important; }
.findbar-find-fast.find-status-icon { -moz-box-ordinal-group: 2 !important; display:none !important; }
.findbar-find-fast.found-matches { -moz-box-ordinal-group: 3 !important; }
.findbar-find-fast.findbar-find-status { display:none !important; }
And it looks sweet -
https://i.imgur.com/mokBejU.jpg
And if you see in my CSS above, I'm using display: none on this "findbar-find-fast.findbar-find-status." Basically, here you go:
Before -
https://i.imgur.com/TAG0fmA.jpg
After -
https://i.imgur.com/WLACw9R.jpg
As you can see, Before the "Phrase not found" text would appear and move everything to the right, thus hiding my close button. But After the text does not appear, nothing moves, my close button remains where it is. And in terms of knowing that nothing has appeared I get the sound notification and the container where I type the text turns red, and that's more than enough to know which way the wind blows.
Now, this still leaves me with one last problem. When I search and find something, a text appears, like "1 of 1 found." See the first screenshot I shared in this post. And I would like to keep this functionality in place. I tried playing with position:relative and position:absolute and display:fixed and margin-right and margin-left and padding, but I got nowhere. Basically I figured I''ll give the element where the "1 of 1 found" appears enough free space so that even when the text appears, it just takes the already empty space and doesn't move anything else.
But no matter what I tried it didn't work
Any wizard here that can do some black magic and solve this one? It's like stuck at 99% haha
If I can't solve it I guess I'll just set display:none on the findbar-find-fast.found-matches and leave it like that. In this case whether my search finds something or not, no text will appear, nothing will ever move, and I'll be okay. Still, I'd love to be able to have the found-matches text actually appear but not move anything...