Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • May 25, 2021 at 11:37 am #1302199
    fkm

    Hi, Enfold team.

    I have the following problem that I cannot explain to myself.
    I’ve tried a lot to solve it. Unfortunately without success.

    I´m using the same text block with right-aligned text for all project pages on my website that I called “breadcrump” (ID).
    Please see example “screenshot-desktop.jpg” and “screenshot-desktop-backend.jpg”.
    This text should appear left-aligned on mobile devices using the following css code:

    @media only screen and (max-width: 767px) {
    #breadcrump {
    float: left !important;
    }}

    That works fine for every single project page (please see e.g. “screenshot-iphone7-02.jpg”), except for one (please see “screenshot-iphone7-01.jpg”), although I used the same saved template for all pages and it´s not even the longest title.

    Do you have an explanation for this? Please help.

    Thank you very much in advance.

    Best regards,
    fkm

    May 27, 2021 at 5:47 am #1302505
    Rikard

    Hey fkm,

    I can’t reproduce the problem on my end using Iphone modulation in Chrome, does this only happen on an actual device? If so, then please let us know the specifics of your device and browser. Also, did you try loading the page in an incognito or private browser window on your device?

    Best regards,
    Rikard

    May 27, 2021 at 10:02 am #1302560
    fkm

    Hey, Rikard.

    Thank you very much for your quick reply.

    Yes, it happens on an actual device: iPhone 7 using Safari (standard window).
    I just tried loading the page in a private window, same issue.

    As you say, the page loads correctly with the modulation in Chrome and also on my brother’s Samsung smartphone.
    So it seems like a specific problem !?

    If there isn’t a quick fix, it wouldn´t be dramatic, because it seems to work on most devices and it only affects one (of many) project pages.
    Still a solution would be nice.

    Thanks in advance for your reply.

    Best regards,
    fkm

    May 31, 2021 at 12:08 pm #1303159
    Yigit

    Hi fkm,

    Thanks for contacting us!

    Could you please try to replace your code with following one

    @media only screen and (max-width: 767px){
#breadcrump {
float: left !important;
width: 100%;
}}

    Best regards,
    Yigit

    May 31, 2021 at 12:30 pm #1303162
    fkm

    Hi, Yigit.

    Thank you very much for your reply.

    I just tried this code and the title shows in one line, but unfortunately the command “float: left !important;” seems to be ignored now, because it appears right-aligned.

    Please let me know what I could have done wrong.

    Thanks in advance.

    Best regards,
    fkm

    May 31, 2021 at 12:58 pm #1303166
    Yigit

    Hey!

    Please add following code to bottom of Quick CSS as well

    @media only screen and (max-width: 767px){
#breadcrump p {
text-align: left!important;
}}

    Regards,
    Yigit

    May 31, 2021 at 3:21 pm #1303207
    fkm

    Hey, Yigit.

    Now it works fine – thank you so much!

    Best regards,
    fkm

    May 31, 2021 at 3:34 pm #1303209
    Yigit

    Hi,

    You are welcome!
    Let us know if you have any other questions and enjoy the rest of your day!

    Best regards,
    Yigit

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘display error in a text block’ is closed to new replies.