Would anyone know how to decrease the size of the 'Next' and 'Back' buttons? Thanks! | Experience Community
Skip to main content
JoseS
Administrator
1 year ago
Solved

Would anyone know how to decrease the size of the 'Next' and 'Back' buttons? Thanks!

  • Dec 21, 2020 6:35 PM UTC
  • 2 replies
  • 335 views

image.png

Best answer by altatunc

It is going to be hidden within the CSS but you can override that with some custom CSS.
likely one of these to play with but i am not sure sure in your environment:
.Skin #Buttons{max-width:200px;margin:0 auto;padding:40px 0;margin-top:-15px;overflow:hidden}
.Skin #Buttons #NextButton,.Skin #Buttons #PreviousButton{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px;font-size:10px;background:#319dab;width:100px;font-size:24px;font-weight:400;min-height:50px;padding:10px 20px}
@media (max-width:100px){
.Skin #Buttons #NextButton, .Skin #Buttons #PreviousButton{width:25%}
}

View original

    2 replies

    Level 2 ●●
    Forum|alt.badge.img+8
    • altatunc
    • Level 2 ●●
    • Answer
    • Dec 21, 2020 7:14 PM UTC

    It is going to be hidden within the CSS but you can override that with some custom CSS.
    likely one of these to play with but i am not sure sure in your environment:
    .Skin #Buttons{max-width:200px;margin:0 auto;padding:40px 0;margin-top:-15px;overflow:hidden}
    .Skin #Buttons #NextButton,.Skin #Buttons #PreviousButton{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px;font-size:10px;background:#319dab;width:100px;font-size:24px;font-weight:400;min-height:50px;padding:10px 20px}
    @media (max-width:100px){
    .Skin #Buttons #NextButton, .Skin #Buttons #PreviousButton{width:25%}
    }

    • khom
    • Author
    • Dec 21, 2020 8:44 PM UTC

    @altatunc THANK YOU SO MUCH!!! I used
    .Skin #Buttons #NextButton,.Skin #Buttons #PreviousButton{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px;font-size:10px;background:#319dab;width:100px;font-size:24px;font-weight:400;min-height:50px;padding:10px 20px}
    and adjusted some numbers, all came out perfect!! 😊

    Terms & ConditionsAccessibility statement