layout content in columns
In a recent project I needed content editors to insert a special div wherever they needed that would float right and have custom styling.

The best solution I came up with was a custom ckeditor plugin. Basically editors just click on the appropriate icon and the necessary html is inserted into the editor. All they have to do is add the content.

Example:


Create a folder inside ckeditors plugin dir and name it
"doublecolumn".
Create a plugin.js file inside that dir.
Add an icon to use for the button inside that dir i.e. "myimage.png.


Then, add the following code in plugin.js:

(function ($) {
CKEDITOR.plugins.add( 'doublecolumn',
{
    init: function( editor )
    {
        editor.addCommand( 'insertDoubleColumn',
            {
                exec : function( editor )
                {
                    editor.insertHtml('&lt;div style="half-width"&gt;&lt;/div&gt;&lt;div style="half-width"&gt;&lt;/div&gt;&lt;div class="clearfix"&gt;&lt;/div&gt;');
                }
            });
        editor.ui.addButton( 'doublecolumn',
        {
            label: 'Double Columns',
            command: 'insertDoubleColumn',
            icon: this.path + 'myimage.png'
        } );
    }
} );
})(jQuery);


I haven't actually tested this but it's similar to what I had used and it should work.

You could also expand the html for each column to something like:

&lt;div class="half-width"&gt;
  &lt;h3&gt;Add Title&lt;/h3&gt;
  &lt;p class="image"&gt;add image&lt;/p&gt;
  &lt;p class="text"&gt;add text&lt;/p&gt;
&lt;/div&gt;


In your case it might be better to put the two columns inside a wrapper div - just to be safe.

Don't forget to enable the plugin and add it to your toolbar from admin/config/content/ckeditor.

Hope this helps.