hi
please check now and also your current string is small so I have increased the font size for this button
http://prntscr.com/1r410q0
now it is looking good
when you increase the string size then it will be moved outside the button so for that you can change the font-size again
I am not sure I understand. Is too small again.
I would like it even bigger, how can I increase the size further?
What change do I need to make? Thank you in advance.
This reply has been marked as private.
hi
the image is broken please add the right one then we will proceed
http://prntscr.com/1r71j7z
see:
@media(min-width:319px) and (max-width:370px){
.product .summary.entry-summary .button.green{
width:250px !important;
display:flex;
left: 20px !important;
flex-direction: column;
font-size: 12px;
box-shadow: 0px 4px 10px 0px rgb(0 0 0 / 50%) !important;
background-color: #5cb85c !important;
color: #fff !important;
border:none !important;
border-radius: 5px;
}
}
@media(min-width:767px){
.product .summary.entry-summary .button.green{
box-shadow: 0px 4px 10px 0px rgb(0 0 0 / 50%) !important;
background-color: #5cb85c !important;
color: #fff !important;
border:none !important;
border-radius: 5px;
}
.product .summary.entry-summary .button.green:hover{
transform: scale(1.1);
background-color: #5cb85c !important;
color: #fff !important;
}
}
@media(min-width:425px){
.product .summary.entry-summary .button.green{
box-shadow: 0px 4px 10px 0px rgb(0 0 0 / 50%) !important;
background-color: #5cb85c !important;
color: #fff !important;
border:none !important;
border-radius: 5px;
}
.product .summary.entry-summary .button.green:hover{
transform: scale(1.1);
background-color: #5cb85c !important;
color: #fff !important;
}
}
@media(min-width:375px) and (max-width:424px){
.product .summary.entry-summary .button.green{
width:250px !important;
left:45px !important;
display:flex;
flex-direction: column;
font-size: 15px;
box-shadow: 0px 4px 10px 0px rgb(0 0 0 / 50%) !important;
background-color: #5cb85c !important;
color: #fff !important;
border:none !important;
border-radius: 5px;
}
}
this is code I have added on your site to show it accordingly on mobile tab laptop and normal screen
from here you can directly change the font-size as per your need
thanks for your confirmation
.
