Twenty Fourteen theme / full width posts?

  • cameraxviscera · Member ·

    Hi there,

    I love the layout of my homepage, but I’m wondering if it’s possible to add some CSS to widen the actual individual posts once they’re clicked on from the homepage?

    Currently the posts feel a bit smushed due to the widgets/links on the right-hand side (within the posts), and I was hoping to either widen the actual central feed of text, or if need be to remove the right sidebar of links.
    (Here is a sample page: https://cameraviscera.com/2016/05/04/music-videos-inspired-by-horror-movies/)

    Any help is majorly appreciated!

    The blog I need help with is: (visible only to logged in users)

  • thesacredpath · Member ·

    Give this a try and see what you think. It uses a Media Query to limit this to 673px and wider screens/windows. Below that the right sidebar moves down below the content to give more room for the content and make it easier to read on narrower devices/windows.

    @media screen and (min-width: 673px) {
.single .site::before {
    background-color: rgba(0, 0, 0, 0);
}
.single .hentry {
    margin-right: 22%;
    max-width: 100%;
}
.single .site-content .entry-header, .single .site-content .entry-content, .single .site-content .entry-meta {
    max-width: 720px;
}
.single .post-thumbnail img {
    width: 100%;
}
}
  • cameraxviscera · Member ·

    As always, you’ve saved the day. Worked perfectly. Thanks again!

  • thesacredpath · Member ·

    Hooray and you are welcome. :)

  • cameraxviscera · Member ·

    Hi again,

    Hate to bother you with this once more, but I need just one more bit of help.

    I implemented that bit of CSS from your last response, and I tinkered with it – altered it just enough to suit the look I was going for (you can see the way I shifted the whole thing more to the center.) However, in doing so, I seem to have thrown something really out of whack. While the post layout it looks fine on the website, if I try and highlight a section of text, it doesn’t want to highlight the complete section. And sometimes, if I try and click something I’ve linked, it’s as if the link isn’t there.

    You can see an example in this post:
    https://cameraviscera.com/2016/05/25/artists-behind-the-image-john-alvin/

    (The ‘sources’ links at the bottom are a good example of links that won’t work.)

    If there’s a cleaner bit of CSS you could provide – while maintaining the centralized look I tried to create – that’d be incredibly helpful!

  • siobhyb · Staff ·

    Hi there,

    Hope you don’t mind me jumping in here. :) I took a look over your problem and think I see what’s happening.

    Please locate the following snippet from the CSS provided by Richard:

    .single .site::before {
	background-color: rgba(0,0,0,0);
}

    And then replace it with the following:

    .single .site::before {
	display: none;
}

    Save your changes and let me know if that resolves the issues you noticed.

  • cameraxviscera · Member ·

    Wow, it sure did – thank you!

  • siobhyb · Staff ·

    I’m so happy to hear that! You know where to find us if extra questions come up too. :)

  • The topic ‘Twenty Fourteen theme / full width posts?’ is closed to new replies.