Hmmm…. I think I’m just going to say “yadda, yadda” whenever I put up example code…
Again, the intent of the example was for showing the differences between inline styling, classes on everything, and basic tags with classes only on special cases. Y’all can certainly code however you want to! lol
As for having to override the bare tag settings when you have special classes… umm, yeah… that’s what you are supposed to do. When you have a special class, then that class is listed after/below the basic tag so you take advantage of cascading style. Can you miss something, sure, I’ve missed a bunch of things over the years. That doesn’t change the idea of setting a base tag with your 98.7% solution.
Real, the problem is, with nested div/font-size shrinking. So, be aware of it when coding. I rarely use a nested div… when I do, I don’t set the font size in the parent div… it really shouldn’t be there in the first place. I will set a default <div> with styling of the div (basic margins, borders, corners, colors, etc.), but then all the other, non div specific, styling goes in the child tags.
The large first letter word search problem is because people use a work-around to compensate for inadequate devices/apps. They use <span>s around the first letter to enable styling it differently. I don’t use that work-around. I use css to style the first letter that way there is no issue with word search or spelling corrections. Yes, I know some older devices are incapable of using current technology… that’s why I said it was possible ‘in some circumstances’ and that they needed to test on their target devices/apps to see if it works. If not, then use fall-back coding.
The simple coding I use for drop-caps or large-first-letter is:
Code:
HTML:
<p class="first">This is the first paragraph in the chapter.</p>
CSS:
p.first {yadda yadda yadda}
p.first:first-line {yadda yadda small-caps yadda}
p.first:first-letter {yadda yadda large letter or drop cap yadda}