I am building a personal project and want the content of the ‘p’ tag which is part of the ‘div class=“intro”’. The ‘p’ tag comes after the ‘h1’ tag so ‘p’ is like a subtitle text.
Logically, I should just be able to specify that I want to format the p in this div tag class and it should be done but the action doesn’t seem to happen.
I have highlighted the HTML code and the CSS one is the last line on the left console
I only want to use CSS for this. Can someone please help? What am I doing wrong?
Your HTML structure doesn’t match this exact pattern, you may need to adjust the CSS selector to reflect the actual structure of your document. For example, if the <p> element is a child of the <div class="intro"> , the selector would be div.intro p { font-style: italic; }
oooh! that does make sense… i was not sure if I needed to mention ‘div’ as well because there’s only one “intro” class on the whole page till now.
Finally, I just added a separate class to the ‘p’ tag and italicised that haha!
I’ll try your solution and see if that works too. Thank you!
I would avoid using selector.selector unless you really need it. Which is usually only the case when the class is added/removed using JS.
In most cases, it will increase the specificity of the selector unnecessarily. Sometimes, it might be used to increase the specificity of the selector intentionally. But that should be done with care. Usually, it can be handled differently.
Another (poor) use might be changing what the class does based on the element it is used on. But I would consider that a bad idea as it makes it harder to know what the class does.
I’m pretty sure the only time I ever use selector.selector is with JS (e.g. toggling the visibility on an element).
