Oh sorry! yeah I got into developer mode and messed with everything I could find until I resolved it. Here is what I wrote - no idea if it's optimal:
.BlogList {
max-width: 600px;
margin-left: auto;
margin-right: auto;
padding-left: 1vw;
padding-right: 1vw;
}
.Main--blog-item .Main-content {
max-width: 600px;
padding-left: 1vw;
padding-right: 1vw;
}
I have a feeling using "px" isn't a great solution. But I'm not sure what the alternative would be.
Is there a way to adjust the Foster Blog Titles and Body text widths across the whole blog?
At the moment the body is extremely narrow unless you expand your browser very wide - at which point the body copy hits a max width (but then the headline runs very wide!)- or until you shrink your browser until the page hits a break point that calls up a body width that's better.
3 Examples
Here is a medium sized browser window where the body is way too narrow:
Here is a very wide browser window where the body text is good but the headline is a bit ridiculous:
And here is a narrow window (right after the break point) - that looks perfect ( if only these proportions would be the max width for both title and body text no matter the browser width):