title: jsTree nodes are displayed on separate line from expansion image
body: <p>I added a jsTree to my page, jQuery 1.6.4 as such:</p>
  
  <pre><code>    &lt;div id="categoriesMenu" class="categoriesMenu"&gt;&lt;!--  --&gt;&lt;/div&gt;
      &lt;script type="text/javascript"&gt;
          function convertCategoriesForMenu(categories) {
              var scrubbedData = [];
              $.each(categories, function(idx,category) {
                  var scrubbedCat = {
                          "data" : category.name,
                          "metadata" : { id : category.id },
                          "children" : convertCategoriesForMenu(category.childCategories),
                          "attr" : { "href" : "${categories_base_url}"+category.id }
                  };
  
                  scrubbedData.push(scrubbedCat)
              });
              return scrubbedData;
          }
  
          $(function () {
              $("#categoriesMenu").jstree({ 
                  "json_data" : {
                      "ajax" : {
                          "url" : "${categories_base_url}",
                          "success" : function (data) { 
                              return convertCategoriesForMenu(data);
                          }
                      }
                  },
                  "themes" : {
                      "theme" : "classic",
                      "dots" : false,
                      "icons" : false
                  },
                  "plugins" : [ "themes", "json_data" ]
              });
          });
      &lt;/script&gt;
  </code></pre>
  
  <p>however, it displays each row on as the expansion image, then on a new line (and grey background) the title:
  <img src="https://i.stack.imgur.com/jxAlp.png" alt="messed up menu"></p>
  
  <p>I can't seem to figure out why.  The JSON data returned from my server does not appear to have any carriage returns or line feeds at the front, and I put breaks in the JS and confirmed that when the browser parses the JSON, it also doesn't appear to have any carriage returns or line feeds.</p>
  
  <p>I tried swapping out the themes, and that didn't seem to have any effect.</p>
  
  <p><strong>Edit 1</strong>
  CSS Inheritance is most definitely the problem. It looks like it's pulling the display:block from Roo's standard.css style for the #menu.  The problem is, that style is needed so that the menu stuff ends up on the left side, which is what I am using the jsTree for.</p>
  
  <p>The structure of the tree is as follows:</p>
  
  <pre><code>&lt;ul&gt; &lt;!-- root of menu, display:block --&gt;
      &lt;li&gt; &lt;!-- Node element, display:block --&gt;
          &lt;ins /&gt;  &lt;!-- image, display:inline --&gt;
          &lt;a&gt;Node Name&lt;/a&gt; &lt;!-- text for node, display:inline --&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>And if I put the tree outside the  tag it works as expected.  But, if I put it inside the , all the elements get set to display:block.</p>
  
  <p>So, the question is: how do I apply a CSS style in-line on the  and  tags?</p>