WordPress.org
Get WordPress

Make WordPress Core

Ticket #29955: radio-and-labels.htm

File radio-and-labels.htm, 2.9 KB (added by afercia, 10 years ago)

Form labels test case

Line 
1<!doctype html>
2<html lang="en">
3<head>
4<meta charset="utf-8">
5<title>html5</title>
6<style>
7
8body {
9        font: normal 16px/1.5 Arial, sans-serif;
10        background: lightblue;
11        padding: 0 20%;
12}
13
14th, td {
15        vertical-align: top;
16        padding: 20px;
17}
18
19</style>
20</head>
21<body>
22<h1>form controls and labels test</h1>
23<p>
24January 26th, 2015. See <a href="https://core.trac.wordpress.org/ticket/29955">WordPress Core Trac ticket #29955</a>
25</p>
26
27
28<form method="get" action="nonempty">
29
30<label>
31<input type="radio" name="test"> implicit label (wrapped)
32</label>
33
34<br>
35
36<label>
37<input type="radio" name="test"> <span>implicit label (wrapped) inside a span</span>
38</label>
39
40<br>
41
42<input type="radio" name="test" id="myradiobutton" checked="checked">
43<label for="myradiobutton"> explicit label (for and id)</label>
44
45<br>
46
47<input type="radio" name="test" id="myradiobutton2" checked="checked">
48<label for="myradiobutton2"> <span>explicit label (for and id) inside a span</span></label>
49
50<br><br>
51
52<table>
53<tr>
54<th scope="row">Date Format</th>
55<td>
56        <fieldset><legend class="screen-reader-text"><span>Date Format</span></legend>
57        <label title="F j, Y"><input type="radio" name="date_format" value="F j, Y" checked="checked"> <span>January 26, 2015</span></label><br>
58        <label title="Y-m-d"><input type="radio" name="date_format" value="Y-m-d"> <span>2015-01-26</span></label><br>
59        <label title="m/d/Y"><input type="radio" name="date_format" value="m/d/Y"> <span>01/26/2015</span></label><br>
60        <label title="d/m/Y"><input type="radio" name="date_format" value="d/m/Y"> <span>26/01/2015</span></label><br>
61        <label><input type="radio" name="date_format" id="date_format_custom_radio" value="\c\u\s\t\o\m"> Custom: </label><input type="text" name="date_format_custom" value="F j, Y" class="small-text"> <span class="example"> January 26, 2015</span> <span class="spinner"></span>
62        </fieldset>
63</td>
64</tr>
65
66</table>
67
68<br>
69
70
71<label>
72<input type="checkbox" name="test2"> implicit label (wrapped)
73</label>
74
75<br>
76
77<label>
78<input type="checkbox" name="test3"> <span>implicit label (wrapped) inside a span</span>
79</label>
80
81<br>
82
83<input type="checkbox" name="test4" id="mycheckbox">
84<label for="mycheckbox"> explicit label (for and id)</label>
85
86<br>
87
88<input type="checkbox" name="test5" id="mycheckbox2">
89<label for="mycheckbox2"> <span>explicit label (for and id) inside a span</span></label>
90
91<br><br>
92
93
94<label>
95implicit label (wrapped)<br>
96<input type="text" name="test6">
97</label>
98
99<br>
100
101<label>
102<span>implicit label (wrapped) inside a span</span><br>
103<input type="text" name="test7">
104</label>
105
106<br>
107
108<label for="mytextfield"> explicit label (for and id)</label><br>
109<input type="text" name="test8" id="mytextfield">
110
111<br>
112
113<label for="mytextfield2"> <span>explicit label (for and id) inside a span</span></label><br>
114<input type="text" name="test9" id="mytextfield2">
115
116
117
118</form>
119</body>
120</html>