-2

I have the following html:

<span class="e-datewidget e-widget validityDate e-ntouch e-valid">
  <span class="e-in-wrap e-box e-padding">
    <input id="ValidityDate" readonly="readonly">
    <span id="ValidityDate-img" class="e-select" style="display: block;">
        <span class="e-icon e-calendar" aria-label="Select">
        </span>
    </span>
  </span>
</span>

I want apply a display:none styling on the span having class: "e-icon e-calendar".

How can I access this span through the input id in CSS to set the display:none styling?

Peter B
  • 22,460
  • 5
  • 32
  • 69
refresh
  • 1,319
  • 2
  • 20
  • 71
  • Adjacent sibling combinator to target the span that follows the input, then descendant combinator to target the `.e-icon.e-calendar` inside of that. https://developer.mozilla.org/en-US/docs/Web/CSS/Adjacent_sibling_combinator – 04FS Jun 28 '19 at 08:21

1 Answers1

1
#ValidityDate + span > .e-icon.e-calendar {
  display: none;
}
schoolcoder
  • 1,546
  • 3
  • 15
  • 31