Preflight not for the whole site

[ValeryVerkhoturov]

I am integrating an externally loaded embedded widget and would like to use Tailwind for styling. Is it possible to apply Tailwind's 3 Preflight reset exclusively to this widget without affecting the rest of the website?

[wongjn]

You could consider disabling the preflight core plugin and make your own implementation that is scoped to your widget.

[ValeryVerkhoturov]

I assigned the ID #widgetInside to the root element in shadow DOM, installed the Tailwind CSS Scoped Preflight plugin, and included it in the Tailwind plugins configuration.

scopedPreflightStyles({
      isolationStrategy: isolateInsideOfContainer(["#widgetInside"])
}),