Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • March 7, 2017 at 12:16 pm #756923
    Dandy

    Hello,

    i redesign my website and use some configurations from new Enfold 2017 demo.
    My problem is, that i got some responsive problems.

    1. On link1 (Private section) i setup the same Grid Row for the team as in Enfol 2017 demo but on my site the problem is, that on iPad vertical it does overlaps the grids. I see that the grid with the picture have more with than the other. Why is this problem by me and not on Enfold demo?
    picture with problem: https://www.dropbox.com/s/if7dg2eu7e8n7n9/team.PNG

    2. On the same link1 i setup a other grid row with 4 animations Numbers. Two problems there on iPad vertical: The words are to long for the grids, and i got a different end of the grid row colors.
    Picture with problem: https://www.dropbox.com/s/2ii9zv0shw1eejq/Ueber-Uns-logo.PNG

    3. On the same link1, in the first color selection on the special heading, the words to long on an iPhone screen, so it cuts the words. Is it possible to shrink the font size that it shows the words complete?
    Picture with problem: https://www.dropbox.com/s/qu6b8kv9vj042du/Ueberschrift.PNG

    4. On link2 at the end there is a grid row two grids with text. On the iPad vertical it cuts the text.
    Picture with problem: https://www.dropbox.com/s/lt2sbfm4mt3calr/home.PNG

    5. On link3 i use a headline rotator and it is to big too in iPhone and ipad mode. It does not shrink the font size.

    6: On link4 i use a tab section and the icons are not on the same height. i think the problem is because on some icons i use not so much words, that it brakes the line
    picture with problem: https://www.dropbox.com/s/1cdnbppkeaqh07a/tabsection.PNG

    Can you please help me to fix this?
    regards manuel

    • This topic was modified 7 years, 8 months ago by Dandy.
    March 10, 2017 at 9:18 am #758758
    Dandy

    Can someone please help me?

    March 13, 2017 at 7:17 pm #760212
    Andy

    Hi,

    please open different tickets for different questions.

    I checked your website on iPad portrait screen size and what I see is: http://i.imgur.com/iOuRXqS.png, which looks fine to me. So could you already fix it?

    I noticed that you are using a caching plugin. Would you mind opening your plugin’s settings page and temporarily deactivate the caching of your site? Then please try to clear your browser cache and hard refresh the site (Hold CTRL + SHIFT + RELOAD) to see if that solves the issue.

    Also please deactivate all plugins one by one to check which one is causing this issue and let us know if this solves the problem.

    Best regards,
    Andy

    March 13, 2017 at 7:28 pm #760216
    Dandy

    Hello Andy,

    thx for your answer, i was testing some css codes at the same time, this is why you get this screen. So please look again.
    I had fixed the problems with headline and headlinerotator. i resized the font size on responsive.

    My problem now is only the grid rows. on link1 and link2

    Is it possible to make from a 4/4 Grid row a 2/2 grid row on ipad portrait?

    March 17, 2017 at 3:37 pm #762535
    Andy

    Hi,

    it would be probably best to create a new Grid Row only for iPad, which you can hide on desktop etc. For this you can at first do this: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
    and then provide a unique css class for your new Grid Row, for example “ipad”. Then use this CSS code inside Quick CSS field:

    @media screen 
  and (min-width: 1200px) { 
.ipad {
display: none;
}}

    Adjust media queries as needed, for more information: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

    Best regards,
    Andy

    March 18, 2017 at 4:35 pm #762917
    Dandy

    Hello Andy,

    i found a solution, to split the 1/4 to 1/2 on ipad.
    You had posted this in 2016

    @media only screen and (min-width: 768px) and (max-width: 1024px) {
  /* Add your Mobile Styles here */
  #top .flex_cell.av_one_fourth {
      width: 50% !important;
      display: block !important;
      float: left !important;
  }
}

    This works.
    Now i want to make a custom section id for these gridrow which i want to split. where i must place the .ipad on the custom css?
    .ipad #top .flex_cell.av_one_fourth {
    #top .ipad .flex_cell.av_one_fourth {
    #top .flex_cell.av_one_fourth .ipad {

    this doesn´t work.

    regards dandy

    March 20, 2017 at 5:48 pm #763710
    Andy

    Hi,

    Would you mind providing a precise link to your site, showing the elements in question? We need to be able to inspect them in order to help :)

    Also provide us admin access, so we can have a deeper look into it.

    Best regards,
    Andy

    March 21, 2017 at 10:04 am #764084
    Dandy

    Hi Andy,

    i solved the problem now, by activating the custom css field. It´s working now.

    thx.

    March 21, 2017 at 1:52 pm #764177
    Andy

    Hi,

    Glad we could help!
    Please take a moment to review our theme and show your support https://themeforest.net/downloads
    To know more about enfold features please check – http://kriesi.at/documentation/enfold/
    Thank you for using Enfold :)

    Best regards,
    Andy

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Problem with responsive’ is closed to new replies.