Viewing 24 posts - 1 through 24 (of 24 total)
  • Author
    Posts
  • #924063

    Hi,

    Why did you close my thread, Basilis?
    https://kriesi.at/support/topic/problems-with-columns-on-ipad-portrait/#post-924044

    It wasn’t solved, I still have these problems, even if I’ve entered the code in the earlier thread that Ismael mentioned that I should check out.
    And using the visibility option doesn’t work.

    Posting again here:
    ”There is two problems showing when entering the first page on my site (https://www.sudersand.se).
    1. I´ve added the code in quick css:
    @media only screen and (max-width: 990px) {
    .only_desktop { display: none !important; }}
    and added only_desktop in i 1/4 column. The column seems to disappear but there is still a small “gap” showing. (see attached image)

    2. On the swedish site this is ok, but when entering the english and the german sites the images “shrinks” (only on portrait.) I´ve tried to look for the problem but I have no idea why they are behaving like this. (see attached image.) Not all images – only two of them.”

    Images is still in thread 924044.

    Regards Johan

    #926235

    Hey Johan,

    You do have multiple tickets ( with the same request as you said ) that is why. Sorry if that was wrong.
    1. The gap is there because the other columns have paddings so it is there because of that.

    2. What software you are using for translations? That is not from us as it seems, because the theme works the same all the ways so
    something from the language plugin is making it.

    Best regards,
    Basilis

    #926307

    Hi,
    Thanks for your answer!

    1. So do you have any ideas to fix the problem?
    The padding is there so the columns will have a nice layout on desktop, but it doesn´t work on tablet portrait. As said before, the visibility option for mobiles doesn´t work when I set the “empty” column on hidden.

    2. I´m using WPML.

    Regards Johan

    #927639

    Hi,

    1. I can see that if we remove it, it does brake on most of the columns also.
    Maybe could work if we add space on the right side also?

    2. Can you please email them? We do have a lot of corporation with them – it will be helpful to get things shorted out.

    Best regards,
    Basilis

    #928007

    Hello,

    1. And don´t know is I understand what you mean with adding space on the right side….?
    Is there a way to have 2 pieces of 1/4 columns in the center of the page (on desktop) without using a empty 1/4 first?
    I think that would be the easiest solution. =)
    Or the best thing is of course if the visibility option worked.

    2. Ok, I can email them and see what they say about it.

    Regards Johan

    #929541

    Hi,

    On the swedish site this is ok, but when entering the english and the german sites the images “shrinks”

    Did you add the css code in the english and german languages’ Theme options > Quick CSS field?

    Best regards,
    Ismael

    #932868

    Hi,

    yes, the codes are exactly the same on each language-page.

    Regards Johan

    #933320

    Hi,

    Please disable the cache and minify plugins temporarily. Save the theme options again then do a hard refresh.

    Best regards,
    Ismael

    #933868

    Done that, but no effect. Even flushed caches on cloudflare.

    Any ideas on problem nr. 1, Ismael? =)

    Best regards Johan

    #935198

    Hi,

    I’m sorry for the late response. I can’t find the attached images. Which of the images are shrinking? Please provide a screenshot.

    Best regards,
    Ismael

    #935726

    No problems Ismael, I´m only grateful for your help.
    Added screenshots in private (and there is one more furter above that I added in the beginning of this thread). There are two images on english site and a few more on the german. =)

    Any ideas on how to fix the other problem, regarding the small spacing on the left of the second last image (named: Tältcamping) on the swedish site? I want a empty column to disappear on mobile/ tablet portrait but it still stays a small gap.
    I mentioned it furter above as:
    “1. I´ve added the code in quick css:
    @media only screen and (max-width: 990px) {
    .only_desktop { display: none !important; }}
    and added only_desktop in i 1/4 column. The column seems to disappear but there is still a small “gap” showing. (see attached image)” .

    #936292

    Hi,

    Thank you for the info. Please use the following css code to fix the column issues.

    @media only screen and (max-width: 989px) and (min-width: 768px) {
    .responsive .av_one_fourth.first.el_before_av_one_fourth.flex_column_div, .responsive .av_one_fourth.first + .av_one_fourth.flex_column_div, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth.flex_column_div, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth + .av_one_fourth.flex_column_div, .responsive .av_one_half.first + .av_one_fourth.el_before_av_one_fourth.flex_column_div, .responsive .av_one_half.first + .av_one_fourth.el_before_av_one_fourth + .av_one_fourth.flex_column_div, .responsive .avia-content-slider-inner .av_one_fourth.flex_column_div, .responsive .av_one_fourth {
        clear: none;
        margin-left: 2%;
        width: 48%;
    }
    }

    Please don’t forget to add the css code to the other languages. Purge the cache afterwards.

    Best regards,
    Ismael

    #936544

    Thanks Ismael!

    It worked like a charm!
    To only thing left is that the element with “Tent camping” (on all three languages) has a padding on the top that I can´t find out why it is there.
    There is no code in style.css either, I think, that refers to any avia-builder-el.

    Please see attached images.

    Regards Johan

    #938485

    Hi,

    I’m sorry for the late response. Please include the following css declaration inside the css media query above.

    
    .responsive .av_one_half.first + .av_one_fourth.flex_column_div, .responsive .av_one_half.first + .av_one_fourth + .av_one_fourth.flex_column_div, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth.flex_column_div, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth + .av_one_fourth.flex_column_div, .responsive .av_one_fourth.first+.av_one_fourth+.av_one_half.flex_column_div {
        margin-top: 0;
    }
    

    Best regards,
    Ismael

    #939059

    Do you mean like this:

    @media only screen and (max-width: 989px) and (min-width: 768px) {
    .responsive .av_one_fourth.first.el_before_av_one_fourth.flex_column_div, .responsive .av_one_fourth.first + .av_one_fourth.flex_column_div, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth.flex_column_div, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth + .av_one_fourth.flex_column_div, .responsive .av_one_half.first + .av_one_fourth.el_before_av_one_fourth.flex_column_div, .responsive .av_one_half.first + .av_one_fourth.el_before_av_one_fourth + .av_one_fourth.flex_column_div, .responsive .avia-content-slider-inner .av_one_fourth.flex_column_div, .responsive .av_one_fourth {
    clear: none;
    margin-left: 2%;
    width: 48%;
    }
    .responsive .av_one_half.first + .av_one_fourth.flex_column_div, .responsive .av_one_half.first + .av_one_fourth + .av_one_fourth.flex_column_div, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth.flex_column_div, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth + .av_one_fourth.flex_column_div, .responsive .av_one_fourth.first+.av_one_fourth+.av_one_half.flex_column_div {
    margin-top: 0;
    }
    }

    If it is this you mean, I´ve tried it and it doesn´t work. =)

    Regards Johan

    #939627

    Hi,

    Yes, that’s what I meant. That particular modification works on our end. Don’t forget to remove the devices’ browser cache. Please provide the WP login credentials in the private field so that we can test the modifications.

    Best regards,
    Ismael

    #939688

    Hmm, tried to look on several ipads but no luck.

    Login are provided in private.

    Thanks!

    Regards Johan

    #939760

    Hi Johan,

    We do not see anything in private, can you send them again please?

    Best regards,
    Victoria

    #939772

    Sorry, here they are!

    Regards Johan

    #941432

    Hi Johan Lindval,

    In English, everything looks aligned and in Swedish not really, the last one is jumping up. Here is the code to fix it

    
    @media only screen and (max-width: 989px) and (min-width: 768px) {
    	.responsive #top .flex_column.av_one_fourth.flex_column_div.avia-builder-el-63 {
    		margin-top: 50px;
    	}
    }
    

    Best regards,
    Victoria

    #942936

    Thanks Victoria, it worked!

    Had the problem on the german site as well but I found the element number on that, so its working now.

    Thanks!

    Regards Johan

    #943372

    Hi Johan,

    Great, glad you got it working and sorry for the problems. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    #943483

    We can close it!

    Thanks!

    Regards Johan

    #944376

    Hi,

    Awesome! We’ll close the thread now. :)

    Best regards,
    Ismael

Viewing 24 posts - 1 through 24 (of 24 total)
  • The topic ‘Not showing on ipad’ is closed to new replies.