How to Change Button Style for Mobile & Tablet?

Community Forums Forums General Discussion How to Change Button Style for Mobile & Tablet?

This topic is: resolved

This topic contains 4 replies, has 3 voices, and was last updated by  ieanea 1 year, 1 month ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #63128

    PaulS
    Participant
    Post count: 9

    I am building a site using the Metro theme SITE HERE

    I really like the simple buttons on the desktop version – nice big blocks

    but when you view the page using a tablet or mobile phone the buttons change to rounded corner buttons with gradient – i DO NOT want this

    does anyone know a solution?

    thanks in advance!

    http://funfitfactory.com
    #63131

    Marcy
    Participant
    Post count: 383

    Find this section in your style.css:
    button,
    input[type="button"],
    input[type="submit"],
    .btn {
    background-color: #08A2AC;
    border: medium none;
    box-shadow: none;
    cursor: pointer;
    margin-right: 30px;
    margin-top: 10px;
    padding: 1rem 1.5rem;
    width: auto;
    }

    Add this line to it. Be sure to keep the “-” in front. This will fix it for iPhone and iPad.
    -webkit-appearance: none;

    so it looks like

    button,
    input[type="button"],
    input[type="submit"],
    .btn {
    -webkit-appearance: none;
    background-color: #08A2AC;
    border: medium none;
    box-shadow: none;
    cursor: pointer;
    margin-right: 30px;
    margin-top: 10px;
    padding: 1rem 1.5rem;
    width: auto;
    }


    #63134

    PaulS
    Participant
    Post count: 9

    Hi Marcy – THANKS!!

    you are a life-saver and thx for the speedy response

    best PAUL

    #63211

    Marcy
    Participant
    Post count: 383

    You’re welcome! I’m glad it helped.


    #64948

    ieanea
    Participant
    Post count: 3

    Great to see this post. I was having the same trouble. I would hope they would include that in the next updated.

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘How to Change Button Style for Mobile & Tablet?’ is closed to new replies.