Congratulations Granny! Very good and perfectly clear all explanations; nothing to add them
But in order to your issues to "vertical-align" images, you can get perfect results by setting "percentages" (positives or negatives) as a value for the property. For example:
Code:
.svgInline {
vertical-align: -0.1%;
height: 1.10em;
}
You also could try with "vertical-align: text-bottom" instead of "vertical-align: bottom" but in the case you presented practically is the same. Also could be a very good idea to use "pixels" as measurement:
Code:
.svgInline {
vertical-align: -5px; /* values also can be positives */
height: 1.10em;
}
But regarding the tutorial you made, just one word: perfect!
Regards
Rubén