Meilix Generator is a webapp which has a build button and after clicking the button it triggers the travis of Meilix repository. You can even generate ISO from your phone. But while opening the web app on a phone, we came to see that the build button is not properly visible. Footer of the page hide the build button. This blog shows the way to identify the build button issue and to make it responsive for all screen sizes.
There are two elements that need correction:
- Build button
Here build button act as a input submit button.
We first added the group to include the button in that form. Then we add the build button property to give the button certain look.
But now also the footer overlap the button. So now we need to work on footer part.
We remove footer class and made a new div tag with the id = “deployment”. Then we set the css for the deployment id to customise its appearance.
This set the footer and build button appropriate to become responsive for all sizes.