如何调整烤面包机弹出宽度

我正在使用AngularJS-Toaster在我的应用中弹出通知。对于我使用bootstrap的前端。如何调整烤面包机弹出宽度

使用类“容器”我有一个1200px的网格。里面我有一个与弹出通知的div。

我想调整弹出通知的宽度，使其与包含此烤面包机的容器的宽度相同。我看到烤面包机有一个参数'position-class'来改变位置，甚至宽度弹出窗口，比如'toast-top-full-width'，但是使用它我会得到一个全屏通知，它不会调整到包含它的容器。我想这是使用Css可以完成的事情，但是如何？你可以帮我吗？

这里我的html代码：

<body data-ng-controller="AppController"> 


    <div id="container" class="container"> 

    <toaster-container toaster-options="{'position-class': 'toast-container','time-out': 3000, 'close-button':true}"></toaster-container> 

     <div id="header" data-ng-include="'partials/header/header.html'" ></div> 



     <div data-ng-view></div> 
     <div id="footer" data-ng-include="'partials/footer/footer.html'"></div> 


     <div id="loader" class="loading overlay" data-ng-if="loader.loading"> 
      <p>We are loading the products. Please wait...</p> 
      <img alt="" src="images/ajax-loader.gif"> 
     </div> 

    </div> 

    <div id="loginPanel" data-ng-include="'partials/content/panels/login.html'"></div>

非常感谢你提前。

来源

2015-01-21 fgonzalez

您可以为您的烤面包机改变class到toast-top-full-width

<toaster-container toaster-options="{'time-out': 3000, 'close-button':true, 'position-class':'toast-top-full-width'}"></toaster-container>

，或者可以创建自定义规则css并将其应用到你的烤面包机，即。

<toaster-container toaster-options="{'time-out': 3000, 'close-button':true, 'position-class':'my-toast-class'}"></toaster-container>

入住例如： - http://plnkr.co/edit/1nZygN?p=preview

来源

2015-01-21 00:42:41 sylwester

如何调整烤面包机弹出宽度

回答

相关问题