How to add a frame to every question on the Q&A on Focal Theme

Deutsch Diskussion Shopify Design

Topic summary

A user seeks help adding borders/frames around individual questions in a Q&A section on the Focal Shopify theme.

Initial Solution:

  • CSS code provided targeting .collapsible-toggle with a 1px solid black border and 5px bottom margin
  • Successfully works on desktop view only

Mobile Issue & Fix:

  • The desktop CSS doesn’t position correctly on mobile devices
  • Additional media query code provided for screens up to 740px width, targeting .faq__item with !important flag to ensure proper rendering

Resolution:

  • User confirms the mobile CSS solution works
  • Thread appears resolved with working code for both desktop and mobile views
Summarized with AI on November 13. AI used: claude-sonnet-4-5-20250929.
4

@MS-Ecom2024 so my first reply was 50% right or 50% wrong? :joy:

for mobile, you’ll have to use the following code:

@media screen and (max-width: 740px){
.faq__item {
    border: 1px solid #000!important;
    margin-bottom: 5px;
}
}