Web typography is very different from print. There is no way to controll the span of text, and font rendering is vastly different, even the same font family on different machines. There is a JS workaround but it’s overkilled for this kind of need.
The best we can do is something like this
#widget_sp_image-11 h3 {
letter-spacing: 1px;
word-spacing: 5px;
}
But strongly not recommended. It’s better to understand and embrace the nature of web typography. Two text strings with different number of characters are not gonna fit and look the same in a certain container width, and there’s nothing wrong with it.
Apparently I didn’t specify, but I wanted to change the *font size*. As I’m looking at the website now, all the widget titles do appear to be the same font size, so I must have fixed it in my earlier attempts. But prior to that, some widget titles were very clearly not the same font size as others. I had seen code for other themes where something like
.widget-title {font-size: 12px;}
was recommended, but that wasn’t having an effect, and I couldn’t figure out if I needed something different than “widget-title”, etc. based on digging through the website’s source code in Developer mode on Chrome. If anyone has that information, it would be good to know for the future.
This is the selector ( along with its default ) for sidebar header of your theme.
.sidebar h3.ui-widget-header {
font-size: 1.2em;
line-height: 1.6em;
margin: 0 -10px 8px;
padding: 0.2em 0.6em;
}
Be sure to use it in Child theme or Custom CSS plugin so that the changes declared after it. Or put more specificity to that selector to be sure.
