FAQ on mobile

[GTS75]

I’m building out my FAQ page using an accordion element. Everything looks great on desktops, but on a vertical iphone screen the + sign arrows are not aligned the way they should be like they are on a desktop. I’ve attached a screenshot of how it looks on my phone. Is there any way to make these align properly?

Thanks

Attachments:

You must be logged in to view attached files.

[Swift Ideas – Ed]

Hi there,

Thanks for pointing that out, this css will fix:

.spb_accordion .spb_accordion_section > h4 a {
	padding: 12px 30px 12px 15px;
	position: relative;
}
.spb_accordion .spb_accordion_section > h4 a:after {
	position: absolute;
	right: 0;
	top: 50%;
	margin-top: -13px;
}

– Ed

[GTS75]

Hey Ed – I added the code & refreshed my browser but I’m still seeing the uneven “+” signs when I view the page on a mobile phone. When the iPhone is tilted horizontally it displays correctly but not when it’s vertical. Any ideas?

[Kyle – SUPPORT]

Doesn’t look like Ed’s css is being applied, can you please try and move it to the top of your custom CSS.

Also if you are using any caching please delete the cache

– Kyle

[GTS75]

Got it. Thanks guys!

[Kyle – SUPPORT]

No problem