Formatting to Single Column

Hi Madeleine,

Thanks for using Chosen!

Try adding the following CSS to your site to switch the layout to one column on the blog:

@media all and (min-width: 900px) {
	
  .blog .entry,
  .archive .entry,
  .search .entry {
    float: none !important;
    margin: 1.5em auto !important;
    width: 70% !important; 
  }
}

You can copy & paste that code into the “Additional CSS” section in the Customizer (Appearance > Customize), and it will take effect right away. The “70%” width value will decide how wide the posts are. Feel free to adjust that until the size looks good to you.

Thank you so much, Ben, that successfully put my content into one column.

One more thing. Now that I’ve done this, a bit of title and comment link formatting is messed up.

I am trying to get my post titles centered and a lot smaller. Similarly, when I click on a post and go to that posts individual page, the title has a different format than on my home page (a lot larger). For some reason I cannot quite figure out the correct additional css.

I have been trying this:
a {
font-size: 16px;
letter-spacing: -10;
text-align: center;
}
h1.post-title {
font-size: 16px;
letter-spacing: -10;
text-align: center;
}

to no avail.

Anyways, if I could have a bit more help with that, I would really appreciate it.
Cheers.

The post titles are in <h2> elements on the homepage and <h1> elements on the post pages, so using <h1> as the selector won’t always work.

Instead, you can stick to using .post-title to target the post titles. If the CSS does not apply, you can add an !important tag, like this:

.post-title {
  font-size: 16px !important;
}