How to stop the stretching and thinning of my elements?

When I’m coding my portfolio page, I’ve been coding it so that the page appears correct to me in ‘Full Page’ view. However, I have noticed when I am in the full page view and I am to zoom out, it stretches and distorts my backgrounds and text and alters the placement of my images. How do I go about making my webpage a more set size and avoid this distortion?

Here is a link to the page and the code. Thank you!

You want to provide alternate column settings for xs display which will trigger when you zoom. This is the “responsive” part of boostrap kicking in and allowing your content to reflow. You can leverage this behavior by providing alternate layouts when your screen won’t fit all of the content; Like prioritizing some content over others, hiding content, providing small/large screen friendly layouts.