Community Forums › Forums › Archived Forums › Design Tips and Tricks › Post Outline/Background
- This topic has 10 replies, 2 voices, and was last updated 9 years, 4 months ago by QUESTIONM.
-
AuthorPosts
-
February 21, 2013 at 2:50 am #21907QUESTIONMMember
Hey guys my site is http://fullcirclecontact.com
I was wondering if anybody knew of a way to change the background of just the posts/post excerpts. I'm using the minimum theme and I've set it to a grey background but was just hoping there's a way to give the individual posts and excerpts a white box to go in.
Here's an example.
So let's just say I wanted to keep the background white like on Brians but inside that red box make it, green, whatever, is that possible?
This is what I mean by excerpts to
http://tinypic.com/r/34o32oh/6
Bonus points if anyone can tell me how to add shading around those boxes too! 🙂
Regards, Luke
February 21, 2013 at 3:40 am #21911Sridhar KatakamParticipantUse this CSS:
.genesis-grid-even, .genesis-grid-odd { background: #FFFFFF; padding: 1em; width: 42%; -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.2); -moz-box-shadow: 1px 1px 3px rgba(0,0,0,0.2); box-shadow: 1px 1px 3px rgba(0,0,0,0.2); }
February 21, 2013 at 5:09 pm #22098QUESTIONMMemberThanks man, that was quick!
That definitely did the trick for the post excerpts but the individual posts themselves are still not.."backgrounded"
is there another css for that?
February 21, 2013 at 10:22 pm #22135QUESTIONMMemberAha! I'm slowly getting the hang of this stuff 🙂
I figured out that the code you gave me worked on the homepage because that's what had a "grid"
I tried simply swapping out the word grid for post like so
.genesis-post-even, .genesis-post-odd {
background: #FFFFFF;
padding: 1em;
width: 42%;
-webkit-box-shadow: -3px 3px 5px rgba(50, 50, 50, 0.8);
-moz-box-shadow: -3px 3px 5px rgba(50, 50, 50, 0.8);
box-shadow: -3px 3px 5px rgba(50, 50, 50, 0.8);
}
img.alignleft {
display: block;
margin-left: auto;
margin-right: auto }but that didn't work 🙁 does anyone know if I'm getting close though?
February 21, 2013 at 10:27 pm #22137Sridhar KatakamParticipantAre we talking about setting background and box shadow of individual posts in archive pages like http://fullcirclecontact.com/blog/ or single post pages like http://fullcirclecontact.com/random-stuff-different-things-ranked/?
February 21, 2013 at 11:19 pm #22146QUESTIONMMemberboth if possible. Anything that is content basically posts, excerpts etc etc
February 21, 2013 at 11:37 pm #22152Sridhar KatakamParticipantDelete the CSS code that you have added, shown in post # 4 of this topic and add the following:
.hentry { background: #FFFFFF; padding: 1em; -webkit-box-shadow: -3px 3px 5px rgba(50, 50, 50, 0.8); -moz-box-shadow: -3px 3px 5px rgba(50, 50, 50, 0.8); box-shadow: -3px 3px 5px rgba(50, 50, 50, 0.8); }
February 22, 2013 at 1:45 am #22160QUESTIONMMemberThat worked perfectly, thank you!
December 5, 2014 at 12:43 am #133669QUESTIONMMemberWell this is awkward, two years later and I'm attempting to create the same effect in Minimum Pro instead of just "Minimum" but this:
.hentry {
background: #FFFFFF;
padding: 1em;
-webkit-box-shadow: -3px 3px 5px rgba(50, 50, 50, 0.8);
-moz-box-shadow: -3px 3px 5px rgba(50, 50, 50, 0.8);
box-shadow: -3px 3px 5px rgba(50, 50, 50, 0.8);
}doesn't seem to be working anymore on this site: amc-pawn.com
Is there a new way?
December 5, 2014 at 3:42 am #133674Sridhar KatakamParticipantDecember 8, 2014 at 12:44 am #133956QUESTIONMMemberThanks again!
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.