title: Ember.js View without Wrapping Div?
body: <p>I have a 3 column layout in my app. I'm using Semantic UI. So, the layout is:</p>
  
  <pre><code>&lt;div class='ui celled grid'&gt;
    &lt;div class='left column'&gt;...&lt;/div&gt;
    &lt;div class='middle column'&gt;...&lt;/div&gt;
    &lt;div class='right column'&gt;...&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>So, straightforward.</p>
  
  <p>In my <code>application.hbs</code> it is simply:</p>
  
  <pre><code>&lt;div class='ui celled grid'&gt;
    &lt;div class='left column'&gt;&lt;!-- menu --&gt;&lt;/div&gt;
    {{outlet}}
  &lt;/div&gt;
  </code></pre>
  
  <p>And the other 2 columns are in my sub-controller/templates. And this works fine until I need a <code>View</code>. If I need a <code>View</code>, then Ember makes the HTML layout become:</p>
  
  <pre><code>&lt;div class='ui celled grid'&gt;
    &lt;div class='left column'&gt;&lt;!-- menu --&gt;&lt;/div&gt;
    &lt;div class='ember-view'&gt;
      &lt;div class='middle column'&gt;&lt;!-- content --&gt;&lt;/div&gt;
      &lt;div class='right column'&gt;&lt;!-- content --&gt;&lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And the wrapping <code>&lt;div class='ember-view'&gt;</code> breaks my layout. Because I don't always need a <code>View</code> I need a way to make the HTML the same for with or without a <code>View</code>.</p>
  
  <p>At this point, I see 2 solutions. I'll either have to rework my layout in some way (that I'm yet to work out). Or I can get rid of the wrapping div.</p>
  
  <p>But is it possible to get rid of the wrapping div? I tried this:</p>
  
  <pre><code>export default Ember.View.extend({
    tagName: null
  });
  </code></pre>
  
  <p>But that doesn't work. I also tried a <code>span</code>, but that still breaks my layout.</p>
  
  <p>Any ideas?</p>
  
  <p>Thanks.</p>