Text is partially hidden in dropdown component on mobile

Hey everyone :slight_smile:

I have made an FAQ section from a dropdown component. However the questions that are in the accordion toggle text box is a little lengthy and is partially hidden on the mobile version (see screenshots). I’ve played around with padding and margin etc. but I’m unsure why this is happening. Can anyone help?

Thank you so much!



Here is my site Read-Only: https://preview.webflow.com/preview/different-glass?utm_medium=preview_link&utm_source=designer&utm_content=different-glass&preview=107400dc353cdefc74c819cb40f32708&pageId=628a61048c4f0463d5e06ddc&workflow=preview

Hi @teeny,

Welcome to the forum!

You can fix this issue by adjusting the size (height) of the accordian within the interaction from 80px to 120px - I’ve recorded a quick demo here to show you what I mean: Screen Recording 2022-05-23...

Hope this helps!

1 Like

That’s great @mww thank you so much for the video!!

However, there is another issue now regarding the desktop view (see screenshot). Since I edited the height on mobile, it now has the same height on desktop, which leads to the text being already revealed. Do I need to create separate accordions for desktop and mobile to fix this?

Thanks again!

Hi @teeny,

I hopefully have a solution for you - recording here: Screen Recording 2022-05-24...

Let me know if you’re still having issues after this!

Thanks :smile:

1 Like

Thank you so much @mww!

This helps me a lot moving forward and encountering issues similar to this in the future!