My query is about whether it's appropriate to reference a child of an element that is not a direct child.
Imagine having this HTML structure:
<form class="formation">
<p>
<span>
<input class="phone input">
</span>
</p>
<p>
<span>
<input class="text input">
</span>
</p>
</form>
If you want to style the inputs just within that form using CSS, can you simply target the form class followed by the input class without specifying the elements in between like so:
.formation .input {
width: 10px;
}
Does this method work correctly?
In my past projects, I have used similar techniques which seemed to work fine. However, for a current media query on a Wordpress site, it doesn't appear to be following this convention. Is this a flawed approach or is there something fundamentally wrong with it? Your insights are appreciated!