Im having trouble with one of my websites. I uploaded it and have it running currently. however, when accessed on a significantly bigger resolution, the website content is centered the way i want it, but the right side of the page is stretched. The content is centered in the body but not on the page, so all the content is centered on the left hand side of the page, but the page has a huge gap to the right of it. Im not sure if i need to change or add something to the html / body element. Help would be greatly appreciated!
For context (and those with bigger monitors) the website is mrscoating.com
It's hard to sift through this code because you're using inline styles all over the place, but I suspect your troubles are related to this...
<div class="container" style="width: auto;max-width: none;height: auto;padding: 0px;">
Why are you adding width: auto and max-width: none rules to responsive containers? I also see you have fixed widths assigned to some paragraphs. Your added code seems to have broken Bootstraps responsiveness.
Im still getting used to BSS, and the responsive containers were being not so responsive until i edited their width values. What do you recommend to solve this issue? Should i set both widths to auto or set predetermined width values? As for the paragraphs, since they are in the container, is the fixed width's an issue for the body in its entirety? i adjusted them to better the look of some paragraphs.