How to select a span inside a span with CSS?

Hi there,

Hope you’re well.
I’m actually having a problem with a very small portion of code:

<div class="showing_jobs">
     Afficher tous les postes CDD, CDI & Freelance <span class="jobs-title-display">Jobs</span>

In fact I’d like to hide the second span there, the one with class “jobs-title-display”.

I tried to add this in my CSS, but it didin’t work

.jobs-title-display .showing_jobs {visibility:hidden !important;}

Really hope that someone here will be abble to provide some help.

Kind regards.

Have you tried

.jobs-title-display {display: none;}

Out of interest, is there a reason why the outer <span> is a <span> and not a <p>?

Thank you so much TechnoBear! You saved my day !

Glad I could help.

Your original code couldn’t have worked, because you had the class names the wrong way round.

.jobs-title-display .showing_jobs {visibility:hidden !important;} targets something with a class of .showing_jobs which is a descendant of .jobs-title-display, but your HTML code was the other way round. (If you need a refresher, this article should help:

I much prefer to keep things simple, if I can.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.