Archived topic
Border Around Recent Posts Widget
11 replies · Started by Dave on October 10, 2019
Hi Guys,
Can I use some CSS to put a border around the Recent Posts widget in my sidebar?
https://stag.irreverentgent.com/how-to-start-working-out-for-men/
I've found a few other forum threads where people asked for something similar, but none of the answers given there seem to have worked for me.
Thank you! I'm loving this theme—totally flexible, but somehow still lightning fast.
Dave
Hi there,
It's not possible to add a border that doesn't look like this with your current layout:
https://www.screencast.com/t/SOsXvQG8K
Any reason why you are using a massive container width like 2597px and then have to compensate it with 177px left content padding and 170px right widget padding to make the page appear narrower?
I couldn't figure out how to get the container dimensions I need using the customizer.
I want the container to be 696 px wide because that's how my current site is set up (I have a different theme on live site and I'm redoing it on a staging site using Generate Press). If I make the container significantly wider or more narrow than 696, I'll have to go back and adjust hundreds of blog posts.
Are there any dimensions you recommend to get a similar look without the crazy padding I've added? If I can figure out, then I can add the border around the Recent Posts widget as well.
Not sure if I understand.
Why can't you set the container width to 696px? It's currently set at 2597px.
Sorry, I'm not familiar enough with the lingo. I want the container width to be wide so that the featured image will run across the full width of the screen with no white space on the sides. But I want the section containing the body copy of blog posts (and the images entered through the text editor in Wordpress) to be 696 px.
So you will want to set the container to a normal width like 696px:
https://docs.generatepress.com/article/container-width/
The featured image is currently a page hero which has its own container settings so you can set them to full widths:
https://docs.generatepress.com/article/header-element-overview/#container
Let me know if this helps :)
Ah, that makes sense, thank you! I think I've figured it out:
https://stag.irreverentgent.com/how-to-start-working-out-for-men/
Now that I've got the container side set properly, is there some code to put the border around the Recent Posts widget?
For some reason I'm seeing the sidebar at the bottom of the page. Is that what you are seeing as well?
If so any chance you can try disabling all plugins except GP Premium to solve that issue first?
Let me know :)
That's funny, I just checked the site on two different devices and in two different browsers (Chrome and Safari), and I'm not seeing that. The sidebar only goes to the bottom of the page on mobile, which is how it should work, I believe.
Now it's working correctly.
Try this for the border:
.sidebar #recent-posts-3 {
border: 1px solid #000;
}
Awesome, thank you!
No problem :)