Hi,
I'm having issues with the CSS for my custom button. The CSS button looks fine on my web browser but it is the exact same size on mobile which is far too big.
Here is the CSS code:
.mktoButton {
background:#F38525 !important;
-moz-appearance: none: !important;
-webkit-appearance: none !important;
border-radius:10px !important;
border:1px solid #ff9900 !important;
display:inline-block !important;
cursor:pointer !important;
color:#ffffff !important;
font-family:Arial !important;
font-size:16px !important;
font-weight:bold !important;
padding:5px 90px !important;
text-decoration:none !important;
text-shadow:0px 0px 0px #ff9900 !important;
margin-left: -110px !important;
}
.mktoButton:hover {
background-color:#00ABF4 !important;
}
.mktoButton:active {
position:relative !important;
top:1px !important;
}
Does anybody know what I am missing to keep the button's size relative to the mobile browser?
Regards,
Youcef
Hi Youcef,
You probably need to add some media queries to your CSS to adapt the rendering to mobile devices.
-Greg