A pretty text box for Blogger posts

In this article I will show you how to create a beautiful text box.

To do this you will need to add the following code in the theme settings, under Custom CSS:

.nice_textbox {
   padding: 0px 10px 0px 10px;
   border-left: 4px solid black;
   font-style: italic;
}

Then, in blog posts, you can use the following syntax to create text boxes:

<div class="nice_textbox"><p>This is a nice textbox</p></div>

to achieve this result

If you need to add such a text box to the current blog post only, then you can edit the HTML code of the blog post and add the following lines, without modifying the custom theme CSS:

<style>
.nice_textbox {
   padding: 0px 10px 0px 10px;
   border-left: 4px solid black;
   font-style: italic;
}
</style>

This is a variation of the above CSS code I use for the photo credits at the end of some blog posts:

<style>
.photo-credit {
   padding: 0px 10px 0px 10px;
   border-left: 3px solid #0076a1;
   font-style: italic;
   font-size: 80%;
}
</style> 

In blog posts, you can use the following syntax :

<div class="photo-credit"><p>Photo credit by...</p></div>

The result looks like this: