Responsive Accordion Help

Design help General
1

Hi Webflowers

Firstly apologies for covering old ground - I’ve set myself down a path of creating FAQ accordions all over my site using the pre-built Dropdown component, to then discover the text within this component isn’t responsive… DOH!

Before I begin a rebuild of all these, can anyone assist me with this solution posted by @vincent a while back.

Basically you set a class on the text within the dropdown toggle (ddown-toggle-text) and then put some custom code in the page head to make it responsive…

.ddown-toggle-text {
white-space:normal !important;
word-break:break-all;
}

I’ve tried implementing it but rather than the custom code doing what it need’s too, it just appears as plain text right at the top of the page on the published site.

Any assistance would be massively appreciated. Share link and site URL below.

Thanks!

Published website: LINK
Here is my public share link: LINK
(how to access public share link)

2

Hi @JamesLondesborough, thanks for the good question, I think the text is appearing at the top of the page, becuase the css need to be wrapped with style tags as thus:

<style>
.ddown-toggle-text {
white-space:normal !important;
word-break:break-all;
}
</style>

I would amend the code and republish, then check the results.

I hope this helps!

3

Thanks very much @cyberdave … I had a feeling it was something obvious I was missing!

I’ll give this a whirl and hopefully it’s job done.

Cheers!

4

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.