引物下拉標簽寬度

Question

我使用了一個primeng 下拉輸入，我想讓包含標簽占位符的div 具有100% 的寬度。
這是我如何使用它：

<div class="ui-grid ui-grid-responsive ui-fluid">
    <div class="ui-grid-row">
        <div class="ui-grid-col-2">
            <p-dropdown [options]="solutionsDropDownData" [(ngModel)]="solutionDropDownValue" placeholder="Solution..."
                [filter]="true" (onChange)="onSolutionChange($event)">
            </p-dropdown>
        </div>
    </div>
</div>

問題是我在占位符后面有一個空格，而我希望占位符為 full width 。 該空間可以在下面看到：

當我選擇其他值時，例如長度更小，空間的寬度會發生變化，如果我使用相同的示例，它會變得更大。

我已經嘗試過這種方法，但都沒有奏效：

1. 使用了autoWidth參數，但這個參數讓我Can't bind to 'autoWidth' since it isn't a known property of 'p-dropdown'. 如果我將它與括號一起使用，則會出錯； 如果我在沒有括號的情況下使用它，錯誤就會消失，但它不起作用（我提到我導入了 DropdownModule ）；

2. 使用如下 css 類（我分別使用它們，或者同時使用它們）：

   .ui-dropdown-label-container{ width:100% !important; }

   .ui-dropdown .ui-dropdown-panel { min-width: 100% !important; 寬度：最大內容； }

3. 使用的樣式參數。

Answer 1

這是因為您用於 PrimeNG 的樣式表。 我們遇到了同樣的視覺問題，並通過將以下 css 類添加到 styles.css 來實現

.ui-dropdown .ui-dropdown-label-container {
    width: inherit !important;
}

實際上inherit調用100% ，我不明白為什么它對你不起作用。

Answer 2

我通過添加以下代碼設法解決了這個問題：

基本上，我只是在 div 中添加了下拉菜單並更改了包含它的 div 的背景顏色。