Customize: some notification areas are within label elements producing invalid HTML

[afercia]

Some (not all) of the notification areas in the Customizer area actually <div> elements within a <label> element. This is invalid HTML and should be fixed.

For example, the "Site Title" one has this markup:

<label>
	<span class="customize-control-title">Site Title</span>
	<div class="customize-control-notifications-container"></div>
	<input type="text" value="WordPress Develop" data-customize-setting-link="blogname">
</label>

If there's really the need to have the notification area between the label text and the input field, one way to fix this is using an explicitly associated label, that is a label that doesn't wrap the input field and uses for/id attributes.

This is also what is requested by the WordPress accessibility coding standards, see ​https://make.wordpress.org/core/handbook/best-practices/coding-standards/accessibility-coding-standards/#labeling

[westonruter]

@afercia This will be resolved by #33085. The issue is that when there is no notification container in a control, it will get injected right after the control title. Since this is inside of a label, this is wrong. I mentioned this at https://core.trac.wordpress.org/ticket/33085#comment:21