function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
DeveloperSudDeveloperSud 

How to inherit css styles in child component from parent in LWC?

What are options available inherit css styles in child component from parent in LWC.
ANUTEJANUTEJ (Salesforce Developers) 
Hi there,

>> https://developer.salesforce.com/docs/component-library/documentation/en/lwc/create_components_css

The above documentation shows an implementation where they have added css to parent and child components, can you try checking it once?

Let me know if it helps you and close your query by marking it as the best answer so that it can help others in the future.  

Thanks.
Suraj Tripathi 47Suraj Tripathi 47
Hi,

Please follow the below link:-
-https://salesforce.stackexchange.com/questions/293264/css-not-applying-to-child-lwc
-https://salesforce.stackexchange.com/questions/248180/how-can-we-expose-inherited-properties-from-a-super-component-s-class-in-a-light

Thanks & Regards
Suraj Tripathi
mukesh guptamukesh gupta
Hi,

A parent component can style a child component, but it styles it as a single element. A parent can’t reach into a child. Let’s add a c-child selector to parent.css that defines a border around the child component.
 
/* parent.css */
h1 {
    font-size: xx-large;
}

c-child {
    display: block;
    border: 2px solid red;
}
Parent in h1  and child in red outline


User-added image

if you need any assistanse, Please let me know!!


Kindly mark my solution as the best answer if it helps you.

Thanks
Mukesh