Column-Matic Shortcode
[[column class="column_left" float=""]Yada yada, spiffy logo image with a funky monkey and a wiffle-ball bat.[/column]]
[[column class="column_right" float=""]Yippy Skippy another logo image with a ding-ding-dong touching tra-la-la.[/column]]
[[end_columns]]
CSS
For normal screens:
.column_left {
margin-left:0;
float:left;
width: 40%;
}
.column_right {
float: left;
margin-left: 10px;
border-left: 1px dotted red;
padding-left: 10px;
width: 40%;
}
For Screens smaller than 450px wide:
@media (max-width: 450px) {
.column_left, .column_right{
width: 95%;
margin: 0 auto;
padding: 3px;
clear: both;
border: none;
}
}
[column class=”column_left” float=””]Yada yada, spiffy logo image with a funky monkey and a wiffle-ball bat.[/column]
[column class=”column_right” float=””]Yippy Skippy another logo image with a ding-ding-dong touching tra-la-la.[/column]
[end_columns]