SandboxCss: Difference between revisions
Jump to navigation
Jump to search
(Created page with '<table class="collapsible collapsed"> <tr> <th>This is the header cell, which is always shown</th> </tr> <tr> <td>This cell is not shown by default.</td> </tr> </table>') |
No edit summary |
||
Line 7: | Line 7: | ||
</tr> | </tr> | ||
</table> | </table> | ||
====Simple example==== | |||
You will need to create three <code>div</code> elements: | |||
<source lang="html4strict"><div class="NavFrame"> | |||
<div class="NavHead">[... This is the title of your collapsible content ...]</div> | |||
<div class="NavContent"> | |||
[... The content you want to hide goes here ...] | |||
</div> | |||
</div></source> | |||
<div class="NavFrame"> | |||
<div class="NavHead">[... This is the title of your collapsible content ...]</div> | |||
<div class="NavContent"> | |||
[... The content you want to hide goes here ...] | |||
</div> | |||
</div> | |||
To initially hide the content do this: | |||
<source lang="html4strict"><div class="NavFrame collapsed"> | |||
<div class="NavHead">[... This is the title of the hidden content ...]</div> | |||
<div class="NavContent"> | |||
[... This content is initially hidden ...] | |||
</div> | |||
</div></source> | |||
<div class="NavFrame collapsed"> | |||
<div class="NavHead">[... This is the title of the hidden content ...]</div> | |||
<div class="NavContent"> | |||
[... This content is initially hidden ...] | |||
</div> | |||
</div> |
Latest revision as of 21:07, 3 February 2010
This is the header cell, which is always shown |
---|
This cell is not shown by default. |
Simple example
You will need to create three div
elements:
<div class="NavFrame">
<div class="NavHead">[... This is the title of your collapsible content ...]</div>
<div class="NavContent">
[... The content you want to hide goes here ...]
</div>
</div>
[... This is the title of your collapsible content ...]
[... The content you want to hide goes here ...]
To initially hide the content do this:
<div class="NavFrame collapsed">
<div class="NavHead">[... This is the title of the hidden content ...]</div>
<div class="NavContent">
[... This content is initially hidden ...]
</div>
</div>
[... This is the title of the hidden content ...]
[... This content is initially hidden ...]