-
Posts
-
I have embed a page on accordion element
the content display well on iPod & bigger screen
but on a phone content overflows
How can I fix it?Thank you for your support
MaritzaI have the same exact issue, I think.. I made an accordion slider with some text, it shrinks too small to see the text on a mobile device. Using the magazine setting, tried all others but none fit and I just want it to be a little taller on the mobile so you can see all of the text there.
Hi,
Please try adding following code to Quick CSS in Enfold theme options under General Styling tab
@media only screen and (max-width: 990px) { .toplevel, .toplevel_popup { width: 100%!important; }}Best regards,
YigitHi,
Sorry for the delay, I checked your site on my Android mobile device Note 2 and the accordion element looks fine(please see screenshot in private).
Please post a screenshot of the issue and share more details about the device and browser you are facing this issue in so we can trouble shoot this further.
Best regards,
VinayHi, I’m not sure what you checked, I don’t see any links on here.. there are two of us seeming to have the same problem. Mine is on this page: http://hearth.betasite-kp.com/what-hearth-stands-for/
The photos stretch across and make them too wide. I can’t take a screen shot easily, it’s on a rollover and the effect disappears for screen grabs, I think you can see it just by looking at the link.
Thanks,
ShannaYigi
I tried the code and nothing happens I checked on the IPod
see screenshot (If I can get it to display correctly on the iPod that will be great)
on smaller screen is bringing up the mobile version that is not good (I’ll check that part)=======
Shannab problem is with the scrolling banner, I have the same issue.
Thank you for all your help
Yigit, that code didn’t solve my issue: http://hearth.betasite-kp.com/what-hearth-stands-for/
You can see on the link above, on a phone device, the accordion slide show needs to be taller. The photos get stretched out of proportion, and the text doesn’t fit.
shanna
Hi,
Please add this in the Quick CSS:
@media only screen and (max-width: 767px) { #top .aviaccordion { max-height: 500px !important; height: 400px; } }Note that the images in the slider might get distorted if you make it taller. Another workaround is to replace the accordion slider with a simple slider on mobile view.
http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
Best regards,
IsmaelHello Team
Accordion content not fully displaying
8/9/16
My request got lost when someone starting posting their problem here
I still have the problem, I was going to create other ticket but I can’t find where to submit a service ticket.
Problem:
I’m embedding content (API) using the accordion element, I also embedded content on the text element
but the content is not displaying fully. Please see what I’m talking about here: See below linkThank you for all your support
Hi,
try this code inside Quick CSS field:
@media only screen and (max-width: 767px) { .toggle_content { padding: 11px 30px 11px 10px; }}and adjust the last number (10px) as needed.
Best regards,
AndyAlmost there!!
The content doesn’t scroll once it reaches the bottom of the page
Click on the last link, them click on the course number to see the problem.
This happens not only on the accordion content but also on a regular text element.Hi,
it seems to be fine to me:
Can you provide us screenshots showing the issue please?
Best regards,
AndyHi,
try this code inside Quick CSS field:
.acalog-permalink-container { overflow: scroll; }Best regards,
AndyKind of scrolling but still not showing all content at the bottom
This is the code I have for this problem:
@media only screen and (max-width: 767px) {
.toggle_content {
padding: 11px 30px 11px 10px;
}}
.acalog-permalink-container {
overflow: scroll;
}
Screenshot below:Hi,
use this code:
.acalog-permalink-container { height: 200px !important; }and adjust if needed. I hope this helps.
Best regards,
AndyHi,
it’s working for me when I test it, but can you provide us admin access, so we can implement the code into your Quick CSS field and make some more testings? post login details here as private reply.
Best regards,
AndyI don’t see it working. I don’t know if you are clicking on the course numbers
content is not wrapping also at the end of the page when clicking on course number on the 2 window content doesn’t
show.See info below
Hi,
I adjusted the height value of my code and now it’s working as expected:
Can you confirm please?
Best regards,
AndyHi,
no idea what you mean now. I followed your instructions:
Go to the bottom of the page
SUMMER SEMESTER I
click on:
ARC 226 Architectural BIM II
then clikc on:
ARC 225
Do you get the full description?
http://degreeprograms.gtccbeta.wpengine.com/api-acalog-test2(hosted on WPengine)
and this part is working for me now.Please always send us precise links to any screenshots you add, otherwise we can’t insepct the elements in question.
Best regards,
AndyHi,
you need to adjust the height value of this code:
.acalog-permalink-container { height: 147px !important; }With height: 147px it should work fine. Otherwise adjust as needed.
However, I don’t think this is a good approach for what you need. Maybe it would be best to work with accordion element instead. Otherwise I guess there is a plugin for such a function out there.
Best regards,
Andy
- The topic ‘Acoordion element overflow on mobile (phone)’ is closed to new replies.