Alignment Issue of Website in different phones

Hi,

There are some alignment issues on my website.

For the sections with people’s bio, while my phone show a decent alignment, somebody tells me that there are some green protrusion, as in the below picture. Anybody know how can I solve this problem? Or Can it even be solved? Thanks all in advance

P.S please ignore the pink words haha.

Preview URL: https://preview.webflow.com/preview/bootcampc2?utm_source=bootcampc2&preview=a4044d12eca82d811d4e60683057b42e

What do you mean?

Next, if the problem is on phones please attach screenshot of mobile view (Not desktop) + Also add live url.

General problems:

1

Change height to min-height.

image

2

Change this:
image

To:
image

**or change display to block (Why do you need flexbox here?)

3

Remove this negative margin & width 500px


Change to:

duplicated class issue

Last. Use the same class for all of your images (Same style = same class== >DRY) - not image39, image13, image345 and so on! to “team-thumbnail”.

Not Paragraph 19, Paragraph 23, Paragraph 34, Paragraph 134 ==> But one class “team-description”.

Not div343 div2345 di3434 ==> (team-card)