I am trying to target the first <div> child under the <body>, excluding any other elements.
While I could assign an ID to the element, I am interested in finding a more universal solution for this scenario.
For example, in a basic setup like this:
<body>
<div></div>
</body>
I can simply use the child selector:
body > div {
margin: 0 auto 0 auto;
width: 800px;
}
However, if there are multiple <div> elements nested under <body>:
<body>
<div></div>
<div></div>
</body>
I can utilize the first-child pseudo-class to target only the initial <div>:
body > div:first-child {
margin: 0 auto 0 auto;
width: 800px;
}
But what if another element is inserted before my desired <div>? How can I still single out the first <div> child element?