How to select several children of an element in CSS


I have an element with id. I try to choose some of its children via CSS selectors.
#myDiv span, #myDiv i works but I wonder if there is a shorter way for this.

I’ve tried nested selectors like

#myDiv {
  & span, i {
    color: red

but didn’t work.

#myDiv span, #myDiv i {
  color: red
<div id="myDiv">
  <span>My Span</span>
  <p>My P</p>
  <i>My I</i>


Your nested code is in SCSS not in CSS, and there is no nesting in CSS.

The shortest CSS code if you will not add any another elements under this container in future will be

#myDiv *:not(p) {
   color: red

Answered By – Abdulrahman Hatem

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published