Frequently Asked Questions

Hold questions and answers in accordion style

Example

Open example in a new window

Code sample

<ul class="faq">
  <li> 
    <details>
      <summary>What is fibre?</summary>
      <div class="answer">
        <p>
          A fibre optic connection sends data at incredible speeds using fibre optic cables.For data transmission, light pulses are used instead of copper wires and electricity, which is a more efficient mehot than that of a traditional copper line. A copper line depends purely on the transmission of electrical currents to peform the same function, but as the current travels over a longer distance, the line deteriorates, and the speed becomes slower. Fibre optic cable can manage a higher frequency range and therefore more data can be transmitted. 
        </p>
      </div>
    </details>
  </li>
  <li> 
    <details>
      <summary>How do I know if there's fibre in my area?</summary>
      <div class="answer">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque pulvinar accumsan mauris nec tincidunt. Etiam ac magna ante. Duis volutpat tellus sit amet velit feugiat, vel vestibulum lacus aliquam. Ut sodales, ex ut dignissim interdum, libero massa fermentum dui, sed ornare libero odio quis urna. Sed euismod arcu est, nec dapibus sem porttitor quis. Morbi ut velit id elit congue auctor. Cras ex nunc, condimentum sit amet ex gravida, ultricies blandit metus. Pellentesque a sem vel enim congue ultricies. Aenean et pulvinar diam, at gravida neque. Vivamus sodales auctor tincidunt. Interdum et malesuada fames ac ante ipsum primis in faucibus. Integer ullamcorper enim in tincidunt egestas.
        </p>
      </div>
    </details>
  </li>
  <li> 
    <details>
      <summary>What if there's no fibre in my neighbourhood?</summary>
      <div class="answer">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque pulvinar accumsan mauris nec tincidunt. Etiam ac magna ante. Duis volutpat tellus sit amet velit feugiat, vel vestibulum lacus aliquam. Ut sodales, ex ut dignissim interdum, libero massa fermentum dui, sed ornare libero odio quis urna. Sed euismod arcu est, nec dapibus sem porttitor quis. Morbi ut velit id elit congue auctor. Cras ex nunc, condimentum sit amet ex gravida, ultricies blandit metus. Pellentesque a sem vel enim congue ultricies. Aenean et pulvinar diam, at gravida neque. Vivamus sodales auctor tincidunt. Interdum et malesuada fames ac ante ipsum primis in faucibus. Integer ullamcorper enim in tincidunt egestas.
        </p>
      </div>
    </details>
  </li>
</ul>

Details

Pattern scope:
Molecule – A combination of disparate Atoms
Relevant assets:
Stylesheets: