[Link Item] Underline styling is applied to a non-link container instead of the link itself

[coseeian]

Title

[Link Item] Underline styling is applied to a non-link container instead of the link itself

Description

The page contains underlined link text, but the text-decoration style is applied to a non-link parent element (

) rather than the interactive link element (). While this does not break accessibility functionality, it may reduce semantic clarity and confuse users — especially those with cognitive disabilities or relying on visual cues for navigation. Applying Underline styling directly to the link element helps improve maintainability and accessibility best practices.

Steps to Reproduce

1. go to /reference/p5/arc/
2. Locate to the following element: ._linklabel_aobbt_1052.current (CSS Selector) (This issue is since to be a global issue)

Actual Behavior

The link text appears underlined, but the underline style is applied to the <li> element rather than the <a> element.

Expected Behavior

The underline should be applied directly to the <a> element to ensure that the visual style matches the interactive element.

Environments

No response

Suggested Fix

Move the underline style from the parent <li> element to the child <a> element.

Reference

This issue is not a direct WCAG violation but is closely related to WCAG 2.2 Success Criterion 1.3.1 - Info and Relationships. It is flagged as a best-practice warning by accessibility evaluation tools.

What is your operating system?

None

Web browser and version

No response

[Mayank2142]

Hi! I would like to work on this issue. It seems like a good beginner-friendly accessibility fix.

Can I take this up?

[davepagurek]

Thanks @Mayank2142! When looking into this, let us know if you notice the CSS class responsible for this being applied elsewhere in the codebase, in case more places than the reference index in the sidebar are affected.

[harshpsi9194]

Is this issue still up for grabs?

[coseeian]

@Mayank2142 @ has taken this up, but I haven’t seen much progress yet. Just checking in — how’s everything going? @Mayank2142 Please let us know if you’d like a hand with anything.

[Mayank2142]

Hi,

Thank you for asking and for clarifying the issue. From what I understand, the problem is that the underline style is being applied to the parent

element instead of directly to the link element. This doesn’t break functionality, but it can cause confusion for users and affects accessibility best practices. The suggested fix is to move the underline styling so that it applies directly to the tag.

Could you please confirm if my understanding of the issue is correct?

I really appreciate you pointing this out. I was a bit worried about how to explain it properly, but I’m starting to work on this issue and have made a little progress.

Thanks again for asking .

[coseeian]

@Mayank2142 Yes, your understanding is correct.

[Mayank2142]

Hi @coseeian @davepagurek ,

I’ve pushed the fix for this issue. The underline styling has been moved from the parent li element to the a element so that the visual style is directly tied to the interactive link.

Changes made: Updated CSS to apply text-decoration on the a element instead of its parent li. Checked in the /reference/p5/arc/ page and confirmed that the underline now applies correctly.

Verified that this change also works consistently across other sidebar links using the same CSS class. This should make the styling more semantic, improve accessibility, and follow best practices. Please let me know if you’d like me to adjust anything.

Thanks for the guidance!