Let's say -
I have a <div> inside <body> and then, this div has a div + img + p inside
<body>
<div id="first">
<div></div>
<img />
<p></p>
</div>
</body>
^ Here, "first" div will have the largest size. So, will LCP treat this div as main content?
vs
I have div + img + p as body's direct children like -
<body>
<div></div>
<img />
<p></p>
</body>
^ Here, body has 3 direct tags, so, LCP basically just go one level down inside your body tag and see which of the tags is the biggest (by area I think, so, height x width)?
Hence, in above case, either of the div / img / p will act as main content?