How to resolve mobile container width conflicts with custom themes on single question page?
Hi everyone,
I am currently integrating AnsPress into a custom WordPress setup for an employee documentation and tech guide resource.
Everything works great on desktop, but on mobile devices, the single question layout seems to have slight overflow/padding issues with the theme’s default content wrapper.
You can inspect the general theme layout I am working with on my live guide setup here: https://mysainsbury.com
Is there a recommended CSS override or a template filter in AnsPress to ensure the question container strictly inherits the parent container width on smaller viewports?
Thanks for any help!
If the overflow still comes from a specific inner element, open the page on mobile (or Chrome DevTools device mode), inspect the element that sticks out, oops games and add that class to the rule above.
AnsPress also supports template overrides. You can copy the relevant template from:
wp-content/plugins/anspress-question-answer/templates/
into:
wp-content/themes/your-child-theme/anspress/
and adjust the wrapper markup if needed. In most cases the CSS above is enough and safer than editing templates.
Clear any caching (plugin + server/CDN) after adding the CSS so the change appears on mobile.
