Before you start, Check out DEMO. CLICK HERE.
1. Login to your Blogger account
2. Go to Layout section, then go to Edit Html.
3. Find this code: ]]></b:skin>
4. Paste below code right after this code.
.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9 url(http://img401.imageshack.us/img401/5783/cv1lg6.gif) no-repeat right bottom;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}
.codeview li {
font-size : 13px;
line-height : 24px;
font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
color : #333333;
font-weight : normal;
margin : 0;
padding : 0;
}
5. When ever you want to add your css code just copy it between this to code
<div class="codeview">
Insert your CSS code or special code here
</div>
Good Luck…..!
Excellent tutorial; but I was looking for an example how this will look like if I implement it. I am also looking for a multi-column paragraph in blogspot, do you have any tutorial for this?
What I am looking for is: 1st normal paragraph, then 2-column 2nd para, then again a normal 3rd paragraph … like that.
Florence´s last blog ..গুগল এডসেন্স:- Iframe-এর মধ্যে দেখানো কি নিয়মবিরুদ্ধ?
I just made demo: Click here. You just need to follow my tutorial. If you want first paragraph to view like code view, then second normal and next again with code view then follow code:
<div class="codeview">
paragraph 1
</div>
Paragraph 2
<div class="codeview">
paragraph 3
</div>
You are done.
Need more help, just contact me, I will help you.
Your tutorial was perfect, in fact I tried it same day after commenting. It worked well without any problems. Now please include this demo link inside post, so other readers can find it (in case they are not reading your comment reply).
I am glad that it worked. I added Demo link in post. Thanks for advice.