The teachable drag and drop page builder is pretty powerful yet has one problem: There are no columns. Therefore you can't put a picture next to a video. Or similar things.

Here is how you can fix that using two parts of code: CSS (in "Code snippets") and HTML (on the page)



CSS code (copy and paste into the "Code Snippets" section under "Site")


/* Copy & paste to Custom CSS area */

/* Two divs in custom wrapper left */
.customwrapperleft {
overflow:hidden;
}

.customwrapperleft div {
min-height: 200px;
padding: 0px;
}
#cwleftone {
float:left;
margin-right:20px;
width:50%;
}
#cwlefttwo {
overflow:hidden;
margin:25px;
min-height:170px;
}

@media screen and (max-width: 550px) {
#cwleftone {
float: none;
margin-right:0;
width:auto;
border:0;
}
}

HTML (copy and paste to as many Text/HTML sections on as many pages as you want)


<!-- Copy & paste in a HTML area on any page -->


<div class="customwrapperleft">
<div id="cwleftone">
<p style="text-align: center;">Put any image or text here.
</p>
</div>
<div id="cwlefttwo">
<p style="text-align: center;">
I teach passionate webpreneurs smart visual skills to grow their business with style.
</p>
<p style="text-align: center;">Ready to create & design without overwhelm? Visit Tobiasmichel.com
</p>
</div>
</div>