Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • December 12, 2020 at 11:42 am #1266750
    ThomSchu

    Hey team enfold,
    I used this Demo template: https://kriesi.at/themes/enfold-church/about/
    It looks good on mobile.
    Unfortunately, my version of the demo (link in private content) doesn’t work on mobile.
    What did I do wrong?
    BR
    Thomas

    December 13, 2020 at 6:02 am #1266868
    Rikard

    Hey ThomSchu,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 767px) {
.page-id-484 #av_section_2 .flex_column_table {
    margin-top: 0 !important;
}
.av-special-heading-tag {
    word-break: break-all;
}
}

    Best regards,
    Rikard

    December 14, 2020 at 1:06 pm #1267118
    ThomSchu

    Hey Rikard,
    many thanks… it works! But…
    As in the template I would like to have the section over the header :)
    And: I need a solution for every page, so I delete the page ID – right?!
    THX
    Thomas

    December 15, 2020 at 6:35 am #1267372
    Rikard

    Hi Thomas,

    It seems to display as on the demo when I remove the code I gave you, could you try to remove it again please? If it goes back to the earlier state then please include admin WordPress login details in private so that we can have a closer look.

    Best regards,
    Rikard

    December 18, 2020 at 9:39 am #1268365
    ThomSchu

    Hi Rikard,
    when I remove the code, the white section goes under the header. That is wrong.
    With the code the white section comes with a gap after the header: Looks good but is noch the purpose :)
    The white section should lay over the header like on desktop or as in the template…
    Link + Login in the private content.
    BR
    Thomas

    December 21, 2020 at 1:52 am #1268907
    Mike

    Hi,
    Sorry for the late reply, and thanks for the login, I commented out the css above, this looks like a z-index issue. I see some theme settings are not showing on your site because you using 4.7.3, please try updating to 4.7.6.4

    Best regards,
    Mike

    January 9, 2021 at 2:32 pm #1271218
    ThomSchu

    Hey Mike,
    I used this template years ago. It works on another website perfecly – and it is also not updated :/
    Nevertheless, I used the code from Rikard and it works!

    @media only screen and (max-width: 767px) {
    .page-id-484 #av_section_2 .flex_column_table {
    margin-top: 0 !important;
    }

    But: On another website (Link below) I had the same issue. Here the CSS code doesn’t work :/
    For now, I build in a seperator to have a “top margin”. But that is not the long-term solution.
    Any idea?

    Thank you. Thomas

    January 9, 2021 at 3:00 pm #1271222
    Mike

    Hi,
    Thank you for the feedback and the link, the css you posted contains a page ID, so this css will only work on that page, and not the linked page. You could use this css:

    @media only screen and (max-width: 767px) {
#av_section_2 .flex_column_table {
margin-top: 0 !important;
}
}

    and it probably will work, but I recommend adding a custom ID to the element on each page that you want this to work on, because the ID #av_section_2 will occur on every Advanced Layout Builder built page, and if it should contain a flex_column_table after this css will fire.
    If this was the only page you are having issues with then try this css with the correct page ID:

    @media only screen and (max-width: 767px) {
#page-id-563 #av_section_2 .flex_column_table {
margin-top: 0 !important;
}
}

    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

    January 14, 2021 at 5:48 pm #1272486
    ThomSchu

    Hi Mike!

    It works – thank you***

    BR
    Thomas

    January 14, 2021 at 5:50 pm #1272487
    ThomSchu

    Maybe you have also a quick css code to change the “h1 product entry title”… I tried so many with any effect :/

    January 15, 2021 at 1:45 pm #1272712
    Mike

    Hi,
    Glad to hear the previous solution helped, what do you want to do to the product title?
    This example will change the color to red:

    #top.single-product #main h1.product_title.entry-title {
	color: red !important;
}

    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.