Need to select the first-child [duplicate] - html

Question

This question already has answers here:
What does the ">" (greater-than sign) CSS selector mean?
(8 answers)
Closed 3 years ago.
I need to center the first a element only.
Example : Text "Ajax" should be centered align, but text "Ajax Help" and Ajax Intro" should be left aligned. I need to implement it for all li element.
ul.child-sidebar-menu li.current_page_parent a:first-child {
position: absolute;
width: 100%;
text-align: center;
}
<ul class="child-sidebar-menu">
<li class="page_item page-item-21 current_page_ancestor current_page_parent has_children">
Ajax
<ul class="grandchild-sidebar-menu level-0 children">
<li class="page_item page-item-104 current_page_item">
Ajax help</li>
<li class="page_item page-item-54">Ajax Intro</li>
</ul>
</li>
<li class="page_item page-item-16">Angular JS</li>
<li class="page_item page-item-29">Jquery</li>
<li class="page_item page-item-31">Jason</li>
<li class="page_item page-item-37">React JS</li>
<li class="page_item page-item-39">Node JS</li>
</ul>

Answer 1

You're looking for the child combinator > to only select the a elements that are direct children of li.current_page_parent, and not the grandchildren.
Note that you won't actually need the :first-child pseudo-class in this case.
ul.child-sidebar-menu li.current_page_parent > a {
position: absolute;
width: 100%;
text-align: center;
}
<ul class="child-sidebar-menu">
<li class="page_item page-item-21 current_page_ancestor current_page_parent has_children">
Ajax
<ul class="grandchild-sidebar-menu level-0 children">
<li class="page_item page-item-104 current_page_item">
Ajax help</li>
<li class="page_item page-item-54">Ajax Intro</li>
</ul>
</li>
<li class="page_item page-item-16">Angular JS</li>
<li class="page_item page-item-29">Jquery</li>
<li class="page_item page-item-31">Jason</li>
<li class="page_item page-item-37">React JS</li>
<li class="page_item page-item-39">Node JS</li>
</ul>
Your other <li> elements don't have the .current_page_parent class, so you can either target .page_item > a if you want to target their (theoretical) children.