【解決方法】別の div クラス内でスタイルの親 div ID を適用するにはどうすればよいですか?

やあ

入力タイプの日付に境界線の色を濃い赤に適用するにはどうすればよいですか?

ありがとう

私が試したこと:

HTML

<div id="mandatory-text">
<input readonly="" tabindex="0" autocomplete="off" type="text" name="Date" class="rz-inputtext  rz-readonly" id="Date" placeholder="DD-MM-YYYY" onclick="Radzen.togglePopup(this.parentNode, 'popuppdfEW2DPWU')" _bl_11="">
</div>

CSS

#mandatory-text:has(.rz-inputtext.rz-readonly) {
        border-color: darkred !important;
    }

解決策 1
解決策 2

解決策 1

あなたになら変えられる –

#mandatory-text:has(.rz-inputtext.rz-readonly) {
        border-color: darkred !important;
    }

に –

#mandatory-text #Date {
        border-color: darkred !important;
    }

これは、div 要素で行ったのと同じように、input 要素の ID も使用します。

フィドルが見つかるここ [^]

解決策 2

あなたのCSS する境界線の色を設定します – 少なくともをサポートするブラウザ :has セレクタ[^]。

しかし、境界線を設定する色境界線を表示するには十分ではありません。の border-width デフォルトは 0、そしてその border-style デフォルトは none。したがって、これらのデフォルトをオーバーライドする他のCSSがない限り、 #mandatory-text 要素を使用すると、目に見えない透明な境界線ではなく、目に見えない濃い赤色の境界線が表示されます。最終結果は視覚的に同じです。境界線は表示されないため、表示されません。