How to remove rules from css/app.css with my css file? Options

[nilovsergey]

In laravel 8/ coreui 3.4 app page news

CODE

    <x-layouts.news>
        <x-slot name="title">{{ trans('News') }}</x-slot>
    
        ...
        <div class="news-content">{!! \Purifier::clean($news->content_shortly) !!}</div>
        ...
    
    </x-layouts.news>

is based on common app layout/css with resources/views/layouts/news.blade.php
template which has 2 css files include :

CODE

    ...
    <link rel="stylesheet" href="{{ mix('css/app.css') }}">
    <link rel="stylesheet" href="{{ mix('css/news.css') }}">
    ...

Problem is that when content_shortly of news has

<i> and <strong>

tags they are not rendered on the form and checking
the page in browser I see that these styles are used from parent html * { : https://prnt.sc/tiYMT3I1NFEo

I search a way to remove these html * { rules on my page BUT without editing css/app.css,


As I encountered this problem when user fills

CODE

    <i>

and

CODE

    <strong>

tags in ckeditor5

I added at top of my scss

CODE

    strong {
        font-weight: unset;
    }
    
    i {
        font-weight: unset;
    }

but that does not work anyway and in browser I see : https://prnt.sc/tTObhLlAvgUR


I tried to add style :

CODE

    html * {
        font-weight: unset !important;
        text-decoration: unset !important;
        font-style:  unset !important;
    }
    
    * {
        font-weight: unset !important;
        text-decoration: unset !important;
        font-style:  unset !important;
    }

But that also did not help - <i> and <strong> tags are not rendered at all...