Narayana Nagireddi
Narayana Nagireddi

Reputation: 749

Style a specific component

I'm trying to apply a style only to a specific component but the style is applied all over the page and not just the subview. Is there a way to apply the style only to one component?

<f:subview>
    <ace:dialog id="pop" draggable="true" modal="true"
        visible="#{bean.popupVisible}" resizable="false"
        closeOnEscape="false" autoCentre="true" header="Details">
        <h:outputStylesheet>
            .ui-dialog-titlebar {
                width:400px;
            }
        </h:outputStylesheet>
...
</f:subview>

Upvotes: 0

Views: 607

Answers (1)

Matt Sisto
Matt Sisto

Reputation: 116

Do you mean only .ui-dialog-titlebar when it is WITHIN another element? If so, yes. You would just need to scope it like this:

.parent-element .ui-dialog-titlebar {
  width: 400px;
}

These styles will only apply to .ui-dialog-titlebar when it is within .parent-element.

Upvotes: 1

Related Questions