角4ポップオーバーブートストラップ

Question

ブートストラップ4のポップオーバーのサイズを変更するにはどうすればよいですか？私はHTMLで試してみますが、私にとってはうまくいかないのです。

私が使用しています：

<ng-template #popContent popoverClass="T"> 

Answer 1

をあなたのユースケースに応じて、2つのオプション持っている：あなたはすべてごpopoversの幅を変更したい場合は、単にブートストラップのカスタマイズよりも

• をCSSはSassプロパティをオーバーライドします。
• 1つのインスタンスの幅を変更する場合は、.popoverクラスを使用して要素をターゲットに設定し、max-widthプロパティをオーバーライドします。

例：

@Component({ 
    selector: 'ngbd-popover-basic', 
    templateUrl: 'src/popover-basic.html', 
    styles: [` 
    :host >>> .popover { 
     max-width: 500px; 
    } 
    `] 
}) 
export class NgbdPopoverBasic { 
} 

plunkerで完全に動作する例：あなたのcomponent.scssのアドオンでhttp://plnkr.co/edit/XHK5lN6VZlp2vwlEsKBS?p=preview

Answer 2

：

:host /deep/ .popover{ 
    left: 0% !important; 
    width: 100% !important; 
    max-width: 500px !important; 
} 

それはあなたが警告するが、完璧に動作できます。

点は覚えておく：中component.tsあなたは、外部CSSやスタイルのコンポーネントを使用するか、ファイル