vendredi 12 juin 2015

Bootstrap table's styles messed up when used with Ember.js

I work with bootstrap. When I create a table in plain HTML, bootstrap's table styles are applied as expected.

But, when I insert the same HTML into an Ember.js template, the bootstrap's table styles don't seem to apply (e.g. table borders, paddings and stripes are not present). Fiddle: http://ift.tt/1GiMwUY

Plain HTML:

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <table id="search-results" class="table table-striped">
                <tr>
                    <td>a</td>
                    <td>b</td>
                    <td>c</td>
                </tr>
                <tr>
                    <td>a</td>
                    <td>b</td>
                    <td>c</td>
                </tr>
            </table>
        </div>
    </div>
</div>

The same HTML - but used in an Ember template:

<script type="text/x-handlebars" data-template-name="application">
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <table id="search-results" class="table table-striped">
                    <tr>
                        <td>a</td>
                        <td>b</td>
                        <td>c</td>
                    </tr>
                    <tr>
                        <td>a</td>
                        <td>b</td>
                        <td>c</td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</script>

<div id="root"></div>

<script>
    App = Em.Application.create({
        rootElement: '#root'
    })
</script>




Aucun commentaire:

Enregistrer un commentaire