Question

I’m trying to have an empty space between two buttons in jQuery Mobile. The layout in reality looks like this:

Button 1      Button 2 (Hidden w/ display: none)        Button 3

And on my page it looks like this:

Button 1      Button 3

I want it to look like this:

Button 1                            Button 3

without deleting the hidden 2nd button, because that button will be displayed as a back button to go back to search results. So, if there are search results, it should look like it does at the top of the page, except with display: none being gone.

I’ve tried float: right on the 3rd button, but that gives me this:

               Button 3              Button 1

Any CSS experts who know how to fix this would be greatly appreciated. Thanks.

Answer 1

Use visibility: hidden; instead of display: none;.