Definition List Based
Might not be Accessible, particularly if multiple instances are nested in each other - further testing required
<div id="expand-set" class="content-width"> <dl class="expand-set"> <dt class="ex-icon"><a class="ex-padding" href="#">Heading</a></dt> <dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum.</dd> <dt class="ex-icon"><a class="ex-padding" href="#">Heading</a></dt> <dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum.</dd> <dt class="ex-icon"><a class="ex-padding" href="#">Heading Nested</a></dt> <dd> <dl> <dt><a href="#">Sub Heading</a></dt> <dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum. </dd> <dt><a href="#">Sub Heading</a></dt> <dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum. </dd> <dt><a href="#">Sub Heading</a></dt> <dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum. </dd> </dl> </dd> <dt class="ex-icon"><a class="ex-padding" href="#">Heading Nested</a></dt> <dd> <dl> <dt><a href="#">Sub Heading</a></dt> <dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum. </dd> <dt><a href="#">Sub Heading</a></dt> <dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum. </dd> <dt><a href="#">Sub Heading</a></dt> <dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum. </dd> </dl> </dd> </dl> </div><!--/expandset-->
In the Custom CSS area of the Metadata Schema
<!-- Expander.css--> <link rel="stylesheet" type="text/css" href="%globals_asset_url:986553%" media="screen" />
In the Head Scripts area of the Metadata Schema
<!-- Expander Script --> <script type="text/javascript" src="%globals_asset_url:74666%"></script>