WordPress.com is an easy way to start blogging. Get a blog, check out our features, read the latest announcements, choose from great themes, or learn about the team behind it.
Need help? Check out our Support site, then
I'm using the Rounded theme, and I would like to change each post so that part of it, including a picture, is in a frame with a colored background. More specifically, if you look at my blog, I would like the picture and the book's description to be in a colored box, so it is more separate than the review of the book in the rest of the post. I have upgraded to CSS, but I'm not sure exactly how to do that.
The blog I need help with is thebusybibliophile.com.
You can do this on a post by post basis by wrapping what you want highlighted in div tags and then you use inline CSS to style things such as the below:
<div style="background-color: #ebeb3d; padding: 5px; margin: 10px; border:3px solid #CC0000;">All the text and such you want in the box here</div>
This could also be added to the custom CSS and then you would again manually wrap the stuff you wanted highlighted in divs and assign a class to that div.
<div class="book">All the text and such you want in the box here</div>
That's what I would recommend too. I like the 2nd option best. It gives you the freedom to change all of them once at a later date if you decide to update the look again.
Thank you for the suggestion. I hate to be that girl, but could be much more specific in those instructions? I'm still learning CSS and I think that's above my skill level right now.
The following you would add to the CSS edit window and then adjust the values as you desire.
thebusybibliophile
designsimply.book {
background-color: #ebeb3d;
border:3px solid #CC0000;
margin: 10px;
padding: 5px;
}In the post HTML tab, you would then wrap the paragraphs/image/etc., with div tags and set the "class" in the opening div like this. You do this each time you need the box around part of the content in a post.
<div class="book">All the text and such you want in the box here</div>
That is exactly what I needed. It works like a charm. Thank you so much!
You are welcome.
This topic has been closed to new replies.
