Dynamically calculate the size of a button

[gnomatech]

Good Morning,

Is it possible to calculate the size of a button (shortcode) according to the size of the page?

Full screen…

Screen minimized…

In both cases, the button is just as big and looks very bad. Is it possible that the size is calculated dynamically?

The styles of the button are the following:

#presentacion a {
padding:28px 40px;
font-size: 25px;
letter-spacing: 0.25em;
text-shadow: none;
}
#presentacion a:hover {
border-color: rgb(41,185,115);
background-color: transparent;
border-width: 2px;
}

Thank you!

[rad]

Hi there,

Thanks for posting in.

Is this your site http://alive.pe/? Would you mind providing the exact URL where your button is? Looks like what it needs is responsive padding.

Like this padding:28px calc(5px + 0.5vw);

Thanks!

[gnomatech]

To access the web, you must put this line in the hosts file of the computer.

134.0.11.194 www.productosjv.com

[mldarshana]

Hi There,

You can use the following set of CSS rules to set your button sizes on different screen width sizes.

@media(max-width:780px){
  #presentacion a {
    padding: 23px 30px;
  }
}
@media(max-width:480px){
  #presentacion a {
    padding: 18px 20px;
  }
}
@media(max-width:320px){
  #presentacion a {
    padding: 15px 15px;
  }
}

Hope that helps.