Add class to ember wrapper div

1

The wrapper div that gets generated around all of my ember routes is messing up my styling. Is there a way to add styling to the wrapper div, class name: ember-view?

2

I don’t think it’s possible to add class to a template, I’m not an expert though.

You can set up application main layout like this:

// templates/application.emblem
.app-container
  = outlet

Or if you use Handlebars:

//templates/application.hbs
<div class='application-wrapper'>
  {{{outlet}}}
</div>

Then you will have body > .ember-view > .app-container > template content.

1 Like
3

It’s easy to target the div in css with body > div.ember-view

1 Like
4

I have been adding a wrapper for the outlet like @Senthe suggests. Although it’s easy to target the div, it’s certainly not ideal that we don’t have the ability to configure it further. If someone doesn’t already see that it’s a problem - we aren’t going to be able to convince them that it is. : (

templates/application.hbs

<div class='outlet application-outlet'>
  {{outlet}}
</div>
5

You could create a component that targets it’s parent and sets classes…