Pure CSS (NoScript) Toggle

This is a test!

Can you see me?

Pros:

  1. It does not need JavaScript (e.g. for NoScript users)
  2. Status is remembered across reloads with no need for cookie tricks

Cons:

It works in Gecko based browsers (Firefox, SeaMonkey, Flock, Netscape...) and in Opera, but it does not work in Safari and IE :(

The relevant styles:

label.toggle { cursor: pointer; color: #068 }
input.toggle { display: none; }
input.toggle:checked+div { display: none; }

The relevant HTML:

<label for="mytoggle" class="toggle">Toggle Div visibility...</label>
<input id="mytoggle" type="checkbox" class="toggle" />
<div>Content here</div>

--
Giorgio Maone

There's a browser safer than Firefox, it is Firefox, with NoScript