Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • July 20, 2017 at 6:57 pm #824796
    SK722

    Hello,

    I am testing out the tabs on a page due to other tab issues. On the bottom of my page — the tab section – looks great on desktop, but in a vertical position on a mobile device, the image is in between the bullet points.

    Also, i am noticing with both Tab sections — the image does not look aligned properly on mobile.

    July 21, 2017 at 6:40 am #824995
    Rikard

    Hey Shiv722,

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

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

    Best regards,
    Rikard

    July 27, 2017 at 11:43 pm #830846
    SK722

    Hi Rikard,

    I have inputted that code and still does not work properly on a mobile device. The last section on that page is the TABS and on mobile device, each picture is after the first bullet point. I would like this to be above the bullet points on a phone when held vertically.

    July 31, 2017 at 1:18 pm #832099
    Victoria

    Hi Shiv722,

    I am seeing all images above text. Here is the code for slight adjustment for images on tablet and some padding below image on mobile:

    
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.toggle_content img.size-portfolio {
  width: 40%;
}
}
@media only screen and (max-width: 767px) {
.toggle_content img {
    min-width: 100% !important;
    margin-bottom: 20px; ---- add this line to the code Rikard gave you.
}
}

    Best regards,
    Victoria

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