Hi All. First post here. I’m trying to get my page to span the entire width of the screen. Currently my page spans about 95% of the width of the screen, then all content (header, main content, footer, etc) stops and the body background color displays for the remaining 5% (until the edge of the screen). When I do an inspect element on the page, I see that the element:
body class="home page page-id-2 page-template-default logged-in admin-bar no-customize-support header-image footer-widgets grid"
Spans the entire width of the screen (without any padding or margin). The line immediately after:
<div id="page" class="hfeed site">
Is identical, except the right-most 5% of the screen is shaded as margin. I would imagine this is the element I need to edit?
If I view the Styles of that element, there is an entry:
media="all"
.site {
background-color: #fff;
max-width: 1260px;
position: relative;
}
If I change that max-width to something higher than 1366 (my current screen resolution), the 5% right-most margin disappears. But when I copy the above code and insert it at the very end of my style.css, the margin remains. What am I doing wrong? I would like a CSS entry to replicate the max-width edit I am making within inspect element.
Thanks in advance.
Edit: typos
