- This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
Viewing 8 posts - 1 through 8 (of 8 total)
- The forum ‘JavaScript’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Home › Forums › JavaScript › Character/Letter Widths
Is there any way to set the widths of characters/letters in CSS?
I.E. Is there any way to make a non-monospaced font, monospaced?
I’m making center aligned countdown timer so some transitions eg 38 to 31 look odd because the ‘3’ moves (because the center point changes).
That doesn’t sound like a character sizing issue..sounds more like an alignment orf positioning issue.
I could see the issue happening with letters, but I believe most fonts give digits the same width.
Same height maybe…but width?
You could be right, it would make a sort of sense….I suppose it’s all in how the glyph was designed.
Indeed…that does seem to be the case.
As I said, sounds like an (vertical) alignment issue…or perhaps a transform-origin
one?
Can’t comment much further without seeing it.
http://codepen.io/matthewfelgate/pen/GgazeZ
Here is a codepen I copied and changed the font to show the issue.
lettering.js looks like a solution, but how would I add it to my Countdown javascript below?
$(".js-seconds .starbox__num")
.countdown("2015/08/22 13:00", function(event) {
$(this).text(
event.strftime('%-S')
);
});
Since we’re now moving to JS…I’ll push this over there.
Me too. But I can I chain lettering.js on after each time countdown.js updates it.
Something like:
$(".js-seconds .starbox__num").countdown(...).lettering();
Is it possible? (my javascript skills aren’t great :$)
Then I can just have some CSS something like:
.char1, char2 {
display: block;
float: left;
width: 100px;
}