开发者

Form markup advice, legend with long "question" text

I'm creating an online questionnaire and was looking for some advice on best practice for the markup. Some of the questions are quite long, they are from a third party and can't be changed. I currently have them like this:

<fieldset>
    <legend><span>Some long question text will go here?</span></legend>
    <input type="checkbox" name="opt1" id="opt1" value="opt1" /><label for="opt1">Option 开发者_StackOverflow社区1</label>
    <input type="checkbox" name="opt2" id="opt2" value="opt2" /><label for="opt2">Option 2</label>
    <input type="checkbox" name="opt3" id="opt3" value="opt3" /><label for="opt3">Option 3</label>
</fieldset>

Does this look ok or are there more accessible techniques? Thanks for any advice


Yup, it's accessible, but there's no reason for the <span> tag.


Yes, this is correct accessible markup, but beware of long <legend> elements if possible. Some screen readers read both the legend and label for each input in the fieldset. If the legend is long, that can be extremely cumbersome for the user.

It's also worth noting that in some browsers a long <legend> won't wrap if it doesn't all fit within the width of the browser window. You can control this by stylizing your legend with white-space:normal

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜