Home>Support>Site Origin Button is too big on mobile

Site Origin Button is too big on mobile

Helle everyone,

I use the Site Origin Widgets for a while now.
Yesterday, I changed something in the header of a website (changes the size of the logo, mobile version).

Since I have done this, the Site Origin Widget (Button) becomes very big on a mobile phone.
On a desktop, everything looks fine. There is just a problem on the mobile phone.
The button becomes very big and isn’t responsible for mobile phones anymore.
I made changes in the Editor (style.css)

This is the website (see inspect element for mobile version)

Home

Coule some one give me some help please?

Many thanks in advance.

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 5 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    Hi Jesse

    Thanks for reaching out. Is there a particular button on the home page we should check? At the moment all looks normal when testing for mobile.

  2. 5 years, 8 months ago Jesse

    Hi Andrew,

    Thank you for your reply. I tested a lot yesterday with the original CCS codes.
    I pasted several parts into my CSS, untill the problem was solved.
    After, there was just a small part which caused the problem.

    @media only screen and (max-width: 860px) {

    body,
    body > div {
    font-size: 18px;
    font-size: 1.8rem;

    I changed the font-size to 1.8rem, it was 4.8rem which made the button look very big.

    Many thanks for your answer, problem is already solved :)

    Have a nice day!

  3. 5 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    Super, glad to hear you’ve made progress.

    A friendly reminder that if you aren’t using a child theme, your edits to style.css will be overwritten if you update your theme.

  4. 5 years, 8 months ago Jesse

    Thanks for the tip Andrew!

    I use the Genesis Framework with the Genesis Sample theme:
    https://www.studiopress.com/sample/

    Both the Framework and Genesis Sample has their own syle.css
    If I make changes in the CSS, I do this in the style.css of the Genesis Sample theme or in the Custom CSS of SiteOrigin.
    Am I doing this right or do you have any other suggestions?

  5. 5 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    Sounds good :) From what I can see Genesis Sample Theme is a child theme of Genesis so you’re good to go. You can either make changes to your child theme or via Custom CSS, it’s up to you. The child theme style.css and Custom CSS are loaded at slightly different times on the page but that doesn’t matter to most situations.

    All the best with your project.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More