Saturday, August 17, 2013

How to Create HMTL Box Code in Blog Post

Tags

1. Put the following code above ]]></b:skin>

/* Code Box
----------------------------------------------- */

.code {
background:#f5f8fa;
background-repeat:no-repeat;
border: solid #5C7B90;
border-width: 1px 1px 1px 20px;
color: #000000;
font: 13px 'Courier New', Courier, monospace;
line-height: 16px;
margin: 10px 0 10px 10px;
max-height: 200px;
min-height: 16px;
overflow: auto;
padding: 10px 10px 10px; width: 90%;
}

.code:hover {
background: #FAFAFA;
background-repeat:no-repeat;
2. Click Save.
3. Now, everytime you add a HTML code in a blog post, put the following code:
<div class="code">
YOUR CODE
</div>

NOTE: Before you put the code on blog post, make sure you encode it first.


EmoticonEmoticon