This is the problem in a nutshell:
vertical-align: top
to every <tr>
in a table, without manually applying the style to every row.<head>
to embed a style.<table>
tag, it appears this style is not passed on to its child elements. (I can see how this is nearly always a good thing.)<style><!--...--></style>
, because that is not a permitted tag on MediaWiki pages.Should I resign myself to adding style="vertical-align: top
to every <tr>
, or is still a solution I am overlooking?
EDIT: Removed a lump of background info, in order to limit the question to what the question title suggests it is about.
It's easy to apply style to a child element, but if you want to apply style to a parent class that already has child elements, you can use the CSS selector child combinators (>), which are placed between two CSS selectors. For example, div > p selects all <p> elements where the parent is a <div> element.
An inline CSS is used to apply a unique style to a single HTML element. An inline CSS uses the style attribute of an HTML element.
Inline styles, while they have a purpose, generally are not the best way to maintain your website. They go against every one of the best practices: Inline styles don't separate content from design: Inline styles are exactly the same as embedded font and other clunky design tags that modern developers rail against.
Can inline CSS apply to child elements nested in the styled element?
Not directly.
Indirectly, only if the child element has that-property: inherit
set in its existing stylesheet.
I was interested in this question from a different context, specifically for styling html emails. Since css can't be added to the head of an email in gmail (believe it or not) the only way to consistently apply email styles is inline.
The answer to this question is no, there is no acceptable way to circumvent the problem in this or any other context that I'm aware of. When approaching a problem like this it is helpful to think about whether the style that you are trying to apply should be an "exception" or a "rule", i.e. if 90% of your tds are vertically-aligned top, you should just apply the style as a rule and go through and correct the 10%. When doing this it's important that you clearly specify your exceptions, preferably with a comment block that references the "rule".
For full reference on what css is supported and where this is very helpful: http://www.campaignmonitor.com/css/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With