custom
codes
Box for Code in Blogger Posts
custom-codes - In this post I will give you a tutorial about adding Box using <textarea> for code in blogger posts, this example box without CSS
First, Edit your blog's HTML code. (Go to Blogger Dashboard > Design > Edit HTML)
Then Find (press CTRL+F) this: ]]></b:skin>
and Add this CSS 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;
}
and Click Save Template.
Then when you go to post your code, click the HTML tab, and just paste this code:
<div class="code">
YOUR CODE
</div>
demo look this post
Subscribe to:
Post Comments (Atom)
Post a Comment