WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: widows and validation

for

From: glen walker
Date: May 8, 2020 5:58PM

It's invalid HTML. <UL> elements can only have <LI> elements (or a
<script> element) as direct children. Your code has a <span> as a direct
child. That's why it's failing. It'd undefined how a screen reader might
interpret it.

<ul>
<li>
<li>
<span>
<li>
<li>
</span>
</ul>

Does the list above have 2 items (the first two <LI>s)?
Does it have 3 items because there are 3 direct children (2 <LI>s and one
<span>)?
Does it have 4 items because there are a total of four <LI>s?
Does it have 5 items because there are four <LI>s plus another child
element (<span>)?

>So, the question is, is this really invalid?

Yes

>Does it mess people up?

Yes

>Can I use it?

Depends. If you want compliant code, then no. There's lots of websites
with invalid code but that doesn't mean you should do it.

> Is there a better approach that I can use?

I'm a noob when it comes to CSS so I can't comment on a decent alternative
but I think you can use CSS selectors to get what you want. Possibly a
combination of the + operator and the :nth-child() selector.


On Fri, May 8, 2020 at 9:59 AM Sandy Feldman < <EMAIL REMOVED> > wrote:

> hey all,
>
> I would love some input on how to get the look I would like on a bit of
> navigation without breaking validation.
>
> I have a horizontal nav, and I would like to prevent a widow by
> controlling where the break happens as text size is increased or the
> browser window is made smaller.
>
> http://ineeda.coffee/nav/4test.shtml
>
> this one looks just right. The last two links wrap onto the second line
> together. They are wrapped in a span styled to "white-space:nowrap".
> This sounds ok to me in VoiceOver. It passes WAVE, but breaks validation
> in everything else I've tried.
>
> I've tried a few other approaches, nothing else works the way I would
> like. Or, if it works, it flunks validation.
>
> So, the question is, is this really invalid? Does it mess people up? Can
> I use it? Is there a better approach that I can use?
>
> thanks so much!
>
> --
>
> Sandy
> sandyfeldman.com
>
> > > > >