html - Is <div> inside <label> block correct? -

i using bootstrap, it's demo of horizontal form:

<form class="form-horizontal" role="form">   <div class="form-group">     <label for="inputemail1" class="col-lg-2 control-label">email</label>     <div class="col-lg-10">       <input type="email" class="form-control" id="inputemail1">     </div>   </div> </form> 

but don't want create id each <input>, so

<form class="form-horizontal" role="form">   <div class="form-group">     <label class="block">       <span class="col-lg-2 control-label">email</span>       <div class="col-lg-10">         <input type="email" class="form-control">       </div>     </label>   </div> </form> 

but display:block can't inside display:inline, use css

.block {   display: block; } 

it's working, correct? because heard should not put display:block element display:inline element (label)

see the specification label element:

content model: phrasing content, no descendant labelable elements unless element's labeled control, , no descendant label elements.

where phrasing content links to:

phrasing content text of document, elements mark text @ intra-paragraph level. runs of phrasing content form paragraphs.

a abbr area (if descendant of map element) audio b bdi bdo br button canvas cite code data datalist del dfn em embed iframe img input ins kbd keygen label map mark math meter noscript object output progress q ruby s samp script select small span strong sub sup svg textarea time u var video wbr text

so no. html not allow <label> contain <div>.