Form Button - CSS

Anonymous
Not applicable

Form Button - CSS

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

Tags (3)
1 REPLY 1
Grégoire_Miche2
Level 10

Re: Form Button - CSS

Hi Youcef,

You probably need to add some media queries to your CSS to adapt the rendering to mobile devices.

-Greg