Tagged: 

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • October 30, 2019 at 2:55 pm #1152365
    rasmusheil

    Hi
    Grid row works on mobile at first view but when I go to the next page on the website and navigate back then grid row elements are totally messed up in mobile view.

    Also I would like grid row boxes to go two in a row when screen is smaller than… and eventually one in a row.

    Can you please help me.

    • This topic was modified 5 years, 1 month ago by rasmusheil.
    November 2, 2019 at 11:58 am #1153237
    Victoria

    Hey rasmusheil,

    Could you please attach a screencast of the issue?

    You need to adjust the grid rows for the ipad screens. Do you need help with that?

    Best regards,
    Victoria

    November 4, 2019 at 5:41 pm #1153738
    rasmusheil

    Hi Victoria

    The screenshot you sent…
    I would like the grid row to be maybe two in row on tablet (if it looks great) (responsive). When boxes go so thin like on the screenshot right now then it is not beautiful and responsive anymore.

    Thank you in advance!

    November 9, 2019 at 6:42 pm #1155233
    Mike

    Hi,
    Sorry for the late reply, but I was not able to reproduce your screenshots unless I changed the width of a browser without refreshing, which doesn’t give an accurate view of the page on mobile. Is this how you are testing?
    Please see the screenshots in Private Content area of 3 different mobile sizes, 320px, 425px, and 768px
    I do see that we can improve the tablet view, 768px, as seen in the last screenshot, by removing most of the padding from the cells with css, which will allow the text to show better.

    @media only screen and (min-width: 767px) and (max-width: 967px) { 
	.av-layout-grid-container .flex_cell.no_margin.av_one_third {
		    padding: 90px 20px 90px 20px !important; 
	}
}

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

    Best regards,
    Mike

    December 1, 2019 at 5:21 pm #1161643
    rasmusheil

    Ok thanks, but I still have the problem… it has been tested by different people in different mobiles.

    I added screen recordings in the private section, there you can see how the problem appears.

    December 1, 2019 at 11:19 pm #1161681
    Mike

    Hi,
    Thanks for the video, but you are adjusting a desktop browser without reloading the page, I tried explaining this above.
    The browser is not re-calculating the percentages of the element widths when you test this way.
    Please see the screenshots I posted above and try testing with your browsers dev tool and try testing with the Mobile Device Viewport Mode
    The main point is that any device doesn’t drastically change it’s screen width like this, so to emulate we reload the page.

    Best regards,
    Mike

    December 2, 2019 at 2:27 pm #1161880
    rasmusheil

    I understand the desktop part and it doesn’t matter for me so much because people usually won’t mess with their browser window width too much. But on mobile device, I can’t change browser window width (if it is mobile portrait view then it is like that). And either way I should be able to adjust my screen width on desktop too and website must stay normal! But in my case it won’t stay normal.
    I have done it with many websites and it has not been the problem before, everything has been working before. As you can see on my screen recordings there are mobile view recording where I don’t adjust my screen (it’s fixed mobile portrait view on iphone 7plus) but it still crashes!!!

    I think you are missing something…

    I doesn’t matter with what I test it with. When it won’t work on my iphone and on two other clients phones too then something is missing…
    I’m not doing anything unusual (see mobile iphone 7plus screen recording),
    Step one: I click on the link and navigate on the next page.
    Step two: I navigate back to where I started and website is messed.
    This is not ok, people use their phones that way everyday and it must work without crashing.

    How to fix this problem? Maybe someone else here can see this problem too just in case you’re missing something.
    Thank you :)

    December 3, 2019 at 12:30 pm #1162169
    Mike

    Hi,
    Sorry, I only have an Android and can’t reproduce this, I will ask a team member to check on an iPhone.
    Thank you for your patience.

    Best regards,
    Mike

    December 3, 2019 at 3:52 pm #1162242
    Yigit

    Hi!

    I added following CSS code to bottom of Quick CSS field in Enfold theme options > General Styling 

    @media only screen and (max-width: 767px) {
.av-layout-grid-container {
display: block;
}}

    Please review your website :)

    Best regards,
    Yigit

    December 3, 2019 at 4:25 pm #1162261
    Guenni007

    look here and tryout the responsiveness.
    under the point “code” you can see how it works.
    These settings had to be adjusted on each case.

    https://webers-testseite.de/content-slider

    December 3, 2019 at 4:26 pm #1162262
    rasmusheil

    Thank you Mike and Yigit!!!

    Problem was not only on iphone but on android or any other phone too…

    Everything works like a charm now. I’m so glad and I appreciate the help so much!
    In my opinion still best Wp theme.
    ..can close the thread.

    December 3, 2019 at 6:02 pm #1162293
    Jordan Shannon

    Hi,

    I’m glad this was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

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