Css3 - вопросы выбора первого ребенка и последнего ребенка

Question

У меня возникли проблемы с кодированием моего первого и последнего дочерних селекторов.

Во-первых, я хотел бы удалить правую границу с последнего дочернего элемента родительского меню навигации (а не выпадающих меню), мой текущий код также влияет на раскрывающееся меню. У меня такая же проблема с удалением левой границы с первого ребенка.

Во-вторых, я хотел добавить тень окна слева и справа от родительского меню навигации, но это также влияет на выпадающее меню.

Я был бы признателен за некоторые советы о том, где я иду не так. Благодаря

Мой CSS3 кода:

ul#navmenu li:last-child a {border-right: none;} 

ul#navmenu li:first-child a {border-left: none;} 

ul#navmenu li:last-child {box-shadow: 200px 0px 0px 0px white;} 

ul#navmenu li:first-child {box-shadow:-200px 0px 0px 0px white;} 

Answer 1

Доступ к прямому потомку ul элементов, как показано ниже, используя > для выбора прямого потомка

ul#navmenu > li:last-child a {border-right: none;} 

ul#navmenu > li:first-child a {border-left: none;} 

ul#navmenu > li:last-child {box-shadow: 200px 0px 0px 0px white;} 

ul#navmenu > li:first-child {box-shadow:-200px 0px 0px 0px white;} 

Вашего текущий селектор ul#navmenu li это означает, чтобы выбрать все теги li, которые подпадают под ul, которые могут быть на любом уровне.

Но этот селектор ul#navmenu > li ограничивает выбор только на немедленном ребенка из ul#navmenu и это является то, что вам нужно.