How to Show HTML/CSS/Java Script codes in a separate box on blogger post

How to Show HTML/CSS/Java Script codes in a separate box on blogger post:

If you want to show your HTML or any other code in a separate box in blogger post you have to add some CSS code to your blog template

Step 1: Login to your blogger

Step 2: Go to Blog template 

             

Step 3: Click on Edit HTML

                       

Step 4: Search for ]]<>/b:skin>  code in your template

                      

Step 5: Copy the below source code and paste it before ]]<>/b:skin> 

.how2doit{
margin :10px;
padding :6px;
background : #efefef;;
height :100px;
border : 1px Solid #81F7D8
overflow:auto;
text-align:lefy;
}

       

Click on save template

6.  If you want to insert any code in your post always write your source code in between

 <div class="how2doit"> Source Code </div>

Ex:

Go to your post editor write bellow code

             

Publish your post and see the result

   

Done

Enjoy :)

Thank you for visiting how2doit.in, if you find any error in my post, please let me now in the comments