search

jessicamlee / CMJSH-agency

CMJSH Agency is a fictional, digital marketing agency focused on designing, developing, and marketing accessible business solutions in the forms of responsive website interfaces.
4 stars 0 forks source link

Content is cut off on team member profiles #38

Open MalcolmTann opened 1 year ago

MalcolmTann commented 1 year ago

Description:

The content on each member profile is pushed up and is cut-off by the top of the viewport.

Steps to Reproduce:

  1. Go to https://jessicamlee.github.io/CMJSH-agency/.
  2. Click on any of the CTA's ("view work") on the team member cards to navigate to the profiles.

Expected Result:

All content should be clearly displayed without any cut-offs or obstructions.

Actual Result:

Most of the content is visible, with only the section heading being cut-off. When expanding the viewport, as the body content grows, it gets cut-off by both the header and footer.

Mobile / Tablet View

Image

Desktop View

Image

Configuration:

This issue was found on all tested Environments,

Devices:

iPhone X, iPhone 13 Pro Max, iPad, iPad Pro, 13' MacBook Pro, Surface Pro 4 (2736 x 1824), Windows 10 Desktop (24" wide screen)

Browsers:

Chrome, Safari, FireFox

jessicamlee commented 1 year ago

RE: https://github.com/jessicamlee/CMJSH-agency/pull/39/commits/73ece8a749e5ba1e4f5c924dddb841b42832f7b9

This issue was (inadvertently) resolved in a previous branch (as above). A new branch was opened (and then closed/deleted) to review and resolve the issue. Upon reviewing the issue in the new branch, it was concluded after retesting the responsiveness of the carousel and its content in the web browsers that the content for the team members on the Profile page is no longer cut off.

In the "37 header bg not visible content not scrollable on profile page #39" branch where the issue was resolved, the issue was resolved by adding more specific breakpoints and setting max-widths to stop the content from growing past a1440px-wide screen.