Help with screenshots for each 'div class'

[paunshotts]

Hi,

I need some help please. I am very new to python and do not know what I am doing most of the time! I am currently using python to browse a website, navigate to a specific page, and then I want to screenshot specific elements of that page.
Sometimes there might be only 1 element, sometimes maybe 10 or more, and I want to screenshot each of them individually.
I have tried many approaches, including a full page screenshot, then cropping it, and also many other approaches using find.all etc, but have not been able to get it to work as I had hoped it would. After screenshotting the specific part of the website, I then want to process those images further, including uploading online and sending to telegram, I have code for this that is working currently, but only sending a screenshot of the full page, which is not ideal.

Below is some code that I was testing, but it did not work as expected. Inside the HTML code, there is the div class "flex flex-col" that I want to capture, this is the parent div class, and inside are other div classes. With the below code, I was getting a screenshot of the parent div class, and then separate screenshots for the other div classes inside the parent. I only want screenshots of each parent div class flex flex-col.

I have also pasted the HTML code for reference.

                flex_col_elements = driver.find_elements(By.CSS_SELECTOR, '.flex.flex-col')
                

                directory_path = r'C:\Project'
                if not os.path.exists(directory_path):
                    os.makedirs(directory_path)
                

            for index, flex_col_element in enumerate(flex_col_elements, start=1):
                if "w-full space-y-1" in flex_col_element.get_attribute("class"):
                        print(f"Ignoring flex flex-col element {index} with class 'w-full space-y-1'")
                        continue


                driver.execute_script("arguments[0].scrollIntoView();", flex_col_element)
                time.sleep(1)
                timestamp = datetime.now().strftime("%Y%m%d_%H%M%S")
                file_name = f"screenshot_{index}_{timestamp}.png"

                flex_col_screenshot_path = os.path.join(directory_path, file_name)
                flex_col_element.screenshot(flex_col_screenshot_path)
                print(f"Screenshot saved for flex flex-col element {index}")
                print(file_name)

Output:
<div class="flex flex-col"><div class="flex text-white relative bg-[#4f574f]"><div class="flex flex-shrink-0 bg-white border-[#0C350E] items-center p-1 font-bold text-base text-[#0C350E]">text here</div><div class="flex justify-between w-full p-2"><div class=""><h2 class="text-lg font-extrabold">more text here</h2><p class="font-light">more text ehre</p></div><div class="flex space-x-2 "><div class="font-semibold">text</div><div>text</div></div></div></div><div class="flex justify-center"><div class="flex m-1 w-5/6 md:w-3/4"><div class="flex flex-col w-full space-y-1"><div class="flex justify-between w-full"><img class="rounded-md object-contain" src="/images/image1.webp" width="35" height="35" alt="img-tag"><div>text</div><div>text</div></div><div class="flex justify-between w-full"><img class="rounded-md object-contain" src="/images/image2.webp" width="35" height="35" alt="img-tag"><div>text here</div><div>text</div></div></div></div></div></div>