Support › Forums › Flex Theme › Slider in mobile view
Tagged: Flex slider, mobile
- This topic has 8 replies, 2 voices, and was last updated 6 years, 8 months ago by
nomad_jess.
-
AuthorPosts
-
August 29, 2016 at 10:19 am #1260
nomad_jess
ParticipantSorry to bring up this topic again, but I’m getting desperate to find a solution.
The current situation on our site (notesofnomads(dot)com) is that the title text in the slider in mobile view is cut off and the ‘Read more’ button is huge. Because the title text is cut off, the reader can’t see what they are clicking on to read more about.
How can I go about making everything fit on the slider – title and ‘read more’ with adequate margin to not look squished?
Any help would be greatly appreciated.
August 30, 2016 at 3:48 pm #1271Chinmoy Paul
ModeratorIf I move the post title and read more button below the slide image with black background color then it would be good for you?
August 31, 2016 at 4:08 am #1274nomad_jess
ParticipantYes, let’s try that option.
Thank you so much!
August 31, 2016 at 11:41 am #1275Chinmoy Paul
Moderator@media only screen and (max-width: 680px) { .flex-caption { background: #333; padding: 30px 20px 20px position: relative!important; text-align: left!important; } }
Try this css. Hope that it will solve your requirement.
September 1, 2016 at 12:35 am #1276nomad_jess
ParticipantThanks for the code. Unfortunately it has deleted the slider images and is just displaying the black box. The black box also has the same formatting issues of the previous slider – text cut off and a huge ‘read more’ button. The black box also seems to be static – just remaining on the one post, rather than rotating between them.
Any help to fix this would be greatly appreciated.
September 19, 2016 at 1:44 am #1309nomad_jess
ParticipantHi Chinmoy,
Just wondering if there is another solution for this problem? I might just have to delete the slider completely otherwise as having our mobile site looking the way it does at the moment is really affecting our stats.
Any help would be greatly appreciated.
September 19, 2016 at 3:38 pm #1313Chinmoy Paul
ModeratorSorry! I missed “;”
Here is the new code:
@media only screen and (max-width: 680px) { .flex-caption { background: #333; padding: 30px 20px 20px; position: relative!important; text-align: left!important; } }
September 19, 2016 at 11:21 pm #1316nomad_jess
ParticipantHi Chinmoy,
Thank you for getting back to me. Forgive me, but is there any difference between this code and the previous one you sent me?
September 19, 2016 at 11:40 pm #1317nomad_jess
ParticipantSorry, it’s the extra semi-colon. I see it now.
It seems to have worked. One problem though is that the slider doesn’t slide automatically. If you swipe your finger across it, it will move. But the reader won’t know there are other posts as it appears to be a static image. Is there any way to rectify this?
Thank you so much!
-
AuthorPosts
- You must be logged in to reply to this topic.