Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • December 19, 2021 at 12:27 pm #1333430
    oestersund

    Hi,
    on my page below alle headings switch to capitals and other colors on mobile – although I´ve set them on “text transform = none”

    H1-H6 shall not change in any resolution / device – what can I do?

    Thx a lot & best regards Tilman

    • This topic was modified 2 years, 11 months ago by oestersund.
    December 19, 2021 at 2:27 pm #1333440
    Mike

    Hey Tilman,
    I checked your page for mobile but I don’t see any headings changing color and the only headings that are in caps are also in caps on desktop:
    the top heading “NAME – PERSONALEXPERTIN AN IHRER SEITE” and the bottom icon list under “Profil / Über mich”
    are these the element you are talking about?

    Best regards,
    Mike

    December 19, 2021 at 2:31 pm #1333441
    oestersund

    Hey Mike,
    yes, these kind of headings I talked about. At my end it depends on screen size & partly on the browser if it changes. Esp. also it happens, if I change windows size on laptop.

    December 19, 2021 at 2:51 pm #1333446
    Mike

    Hi,
    Thanks for the feedback, I found that the color, font-weight, & text-transform changes starting at 1100px due to this css:

        #top #wrap_all .all_colors h1, #top #wrap_all .all_colors h2, #top #wrap_all .all_colors h3, #top #wrap_all .all_colors h4, #top #wrap_all .all_colors h5, #top #wrap_all .all_colors h6 {
        color: #355c9e;
        font-weight: 400;
        text-transform: none;
    }

    being in a media query: @media only screen and (max-width: 1400px) and (min-width: 1100px)
    but I can’t tell if this is due to theme settings or custom css?
    What is your goal black and caps all of the time, or blue and title case all of the time?
    If your not sure if this is custom css then perhaps include an admin login so I can correct for you.

    Best regards,
    Mike

    December 19, 2021 at 2:54 pm #1333447
    oestersund

    Hi Mike,
    blue and no caps please:-)

    my custom css currently is:

    /* devices hamburger */
    @media only screen and (max-width: 1400px) and (min-width: 1100px) {
    .responsive #top .av_mobile_menu_tablet .av-main-nav .menu-item {
    display: none;
    }

    /* No Navi on pages*/
    .page-id-666 .main_menu {
    display: none;
    }

    /* Quotes*/
    strong.avia-testimonial-name {
    color: #355c9e;
    }

    /* Footer*/

    #footer .widget {
    margin: 0;
    }
    #footer {
    padding: 0;
    }

    #footer #text-3 p {
    margin: 0;
    }

    December 19, 2021 at 3:59 pm #1333448
    oestersund

    Hi Mike,
    temp login pls find below

    Thx & best regards Tilman

    December 19, 2021 at 4:39 pm #1333449
    Mike

    Hi,
    Thanks for the login, so what happen was in your Quick CSS your media query didn’t have a closing bracket so in the merged stylesheet any added css, from your advanced styling options for example, were treated as part of the media query, to correct I added a closing bracket in your Quick CSS.
    Please clear your browser cache and check.
    You will note that your advanced styling options, blue h4, doesn’t apply to your icon list under “Profil / Über mich” because this element has a title color option that overrides the advanced styling options:
    2021-12-19_001.jpg
    so you will need to make the change there.

    Best regards,
    Mike

    December 19, 2021 at 5:22 pm #1333454
    oestersund

    … small detail – big effect :-)

    Thx a lot Mike, great job !!

    December 19, 2021 at 6:02 pm #1333460
    Mike

    Hi,
    Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘All headings change colors / capitals on mobile’ is closed to new replies.