Label als Blockelement?

Dear visitor, welcome to Coder Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

Michel

Trainee

Posts: 29

Saturday, February 26th 2011, 5:32pm

Label als Blockelement?

Hallo Zusammen,
Ich möchte eine checkbox benützen, um Werte zu übermitteln.
In meinem Layout wollte ich das Label dazu nutzen um einen Linkeffekt zu simulieren.

	Source code
1 2 3 4 5	<label> <span>Titel</span> <span>Text</span> <input type="checkbox" /> </label>

Zu meiner Verwunderung ist es trotz display:block oder inlie-block recht Buggy. Der aktive Zustand erreiche ich nur wenn ich die checkbox direkt anwähle....
Ich weiss das ein Label ein Inline Element ist doch vielleicht weiss jemand einen Trick? Oder geht dies doch nur über Javascript?
Beispiel hier

Elfram

Unregistered

Sunday, February 27th 2011, 5:57pm

Probiers mal so:

HTML Code

<label for="check">
<span>Titel</span>
<span>Text</span>
<input type="checkbox" name="check" />
</label>

Torben Brodt

Administrator

Posts: 8,454

Sunday, February 27th 2011, 6:48pm

das for des Labels bezieht sich auf eine ID eines Formularelements.

Das sollte die Lösung sein:

HTML Code

<label for="check">
  <span>Titel</span>
  <span>Text</span>
  <input type="checkbox" name="check" id="check" />
</label>

Latest blogs: Neuer EX4 Server, Java EE Summit im Juni in München, Kostenlos zur Cebit + Windows 8 Entwickler Schulung

Michel

Trainee

Posts: 29

Sunday, February 27th 2011, 7:37pm

Hallo Zusammen,
Also mein Beispiel ist ja wie Torben es sagt.
Dies geht ja. Doch ich wollte noch einen dritten Status... active. Das heisst man klickt das Label. Label aktiviert Checkbox und bekommt dann (siehe Quellcode via Javascript ) die Klasse active.... komischerweise geht das mit klick auf das Label nur buggy.... wenn man die Checkbox direkt anklickt geht es...