title: Float button to the right on tinyMCE toolbar
body: <p>What I'm trying to do is create a toolbar with some default buttons aligned to the left but then have a custom button/drop down aligned to the right of the very same toolbar.</p>
  
  <p>Here's my html/javascript/init:</p>
  
  <pre><code>&lt;h3&gt;
    Behold: Magic
  &lt;/h3&gt;
  &lt;div&gt;
    &lt;%= text_area_tag :content, "", id: "magic", rows: 20 %&gt;
  &lt;/div&gt;
  &lt;script type="text/javascript"&gt;
  tinymce.init({
    selector: "#magic",
    plugins: "link image",
    menubar: false,
    toolbar: "bold italic underline strikethrough | styleselect | bullist numlist | undo redo | link image | insertField",
    setup: function(editor) {
      editor.addButton("insertField", {
        type: "menubutton",
        text: "Insert Field",
        style: "float: right",
        menu: [
          { text: "First Name", onclick: function() { editor.insertContent("tom"); } },
          { text: "Last Name", onclick: function() { editor.insertContent("prats"); } }
        ]
      });
    }
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>So far this code works in the sense that a tinyMCE toolbar with all the elements is there, but still aligned to the left. Here's how it looks/should look:</p>
  
  <p>Wrong:</p>
  
  <pre><code>These | Count | As | Buttons | Floated | Left | Floated Right
  </code></pre>
  
  <p>Right:</p>
  
  <pre><code>These | Count | As | Buttons | Floated | Left                       Floated Right
  </code></pre>
  
  <p>As you can see, I tried adding css through the style (but also classes) option and although it appeared on the element, the element did not go to the right side. Any help would be appreciated.</p>