Never mind, I solved it myself after seeing the Author of the plugin takes months to respond (if at all) so I’m posting this for anyone else that runs into this issue:
Problem: When a user tapped ‘Book Test Drive’, the pop-up modal form that would accept user information was pushed off to the left side, making it un-usable on mobile devices.
Solution: After hours of searching and tweaking the right code and inspecting the page via Google Chrome’s inspect option, I was able to discern the Id of the Modal (.modal-dialog) and then was able to implement custom CSS to affect it.
1. Go to Appearance, Customize, Custom CSS
2.Paste the following code in:
.modal-dialog {
position: absolute;
top: 5%;
left: 25%;
transform: translate(-50%, -50%);
max-width: 100%;
}
3. Save Changes
4. Run Tests
I’m no coding master, but I believe the real important part of the code is having the position be “absolute” which keeps the pop-up test drive modal, in the center of the page on mobile devices and the “max-width” that allows the modal to properly size itself depending on the pixel width.
