Tagged: ,

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • November 1, 2016 at 1:15 pm #706685
    rachelvanstaalduinen

    Dear supporter,

    How do I make sure that elements display on top instead of next to each other on mobile? Now, my homepage shows elements squeezed together to fit them both on the screen (next to each other). Texts is now hard to read since only one word is on one line.

    I have both 1/2 elements sitting inside a content-section and isolated; not embedded in any other element.

    Thanks in advance for reaching out to me!

    Regards

    Rachel

    November 2, 2016 at 7:18 am #706976
    Rikard

    Hi Rachel,

    Please send us a temporary admin login and login URL so that we can have a closer look. You can post the details in the Private Content section of your reply.

    Best regards,
    Rikard

    November 2, 2016 at 11:25 am #707051
    rachelvanstaalduinen

    Dear Rikard,

    Find below the login details.

    Thanks in advance for your support!

    Regards,

    Rachel

    November 3, 2016 at 6:40 am #707562
    Rikard

    Hi Rachel,

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

    @media only screen and (max-width: 767px) {
.home #av_section_3 .av_one_half {
  width:100% !important;
}
}

    Best regards,
    Rikard

    November 3, 2016 at 1:32 pm #707716
    rachelvanstaalduinen

    Dear Rikard,

    Thank you for your input. Unfortunately the quick css does not provides me with a different appearance on mobile devices. Hopefully you can help me with a solution.

    Friendly regards

    Rachel

    November 3, 2016 at 2:10 pm #707723
    rachelvanstaalduinen

    Dear Rikard,

    Now that I took another look, the element that contains ‘wij hebben een schat aan:’ and than the header rotation, does stack the two 1/2 elements on top of each other now. The elements below this one stil do not appear on top of each other. Also the footer is not user friendly now.

    Regards,

    Rachel

    November 4, 2016 at 6:35 am #708046
    Rikard

    Hi Rachel,

    Sorry about that, please try replacing the code I posted earlier with this:

    @media only screen and (max-width: 767px) {
.home .av_one_half {
  width:100% !important;
}

.home #footer .av_one_third {
    margin-left: 0 !important;
    width: 100% !important;
}
}

    Best regards,
    Rikard

    November 4, 2016 at 11:15 am #708133
    rachelvanstaalduinen

    Great!

    Thank you Rikard, this css code works! Great support!

    Have a nice day,

    Rachel

    November 5, 2016 at 6:15 am #708554
    Rikard

    Hi Rachel,

    Great, glad we could help and sorry for the problems. Please let us know if you should need any further help on the topic.

    Best regards,
    Rikard

    November 17, 2016 at 4:47 pm #713636
    rachelvanstaalduinen

    Dear Rikard,

    The problem I had earlier with stacking elements on top of each other now results in a new issue related to this previous issue. Since our .CSS adjustment, now my footer content is displayed on top of each other on desktop. I’m on a mac using chrome as my browser (full screen). The issue appeared also on the windows computer of my friend who is also in chrome.

    Hopefully you can help me make sure that content elements on the home page does stack on top of each other on mobile, but do not on desktop > the should be displayed next to each other.

    Friendly regards and thanks in advance for your help

    Rachel

    November 17, 2016 at 5:04 pm #713650
    Yigit

    Hi!

    There was a small error in your media queries. I corrected them. Can you please review your website now and post a screenshot of the issues if they remain?
    You can upload your screenshots on imgur.com or Dropbox public folder and post the links here :)

    Cheers!
    Yigit

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