Ignore functionality, mostly working ‘under the hood’, but not linked together yet (or calc engine is not yet connected to seven segment text).
I’ve tried all manner of align methods and the like or ‘forcing’ ‘right’, both on child and parent. But when I do the append the digits always come out ‘centered’.
Obviously, for the simulation I’d like to have them ‘pegged’ to the right of the display and flow left-- Not sure what I am missing here.
To ‘try’, you have to hit the black button first to turn it on, then just type some numbers. #display is the container and .sevenSegment the class, though every digit also gets their own dynamic ID.
Why can’t I just get this thing to sit ‘nicely’ to the right ?!?
Did you try text-align:right ?
You seem to have the same style applied in the top box as for the buttons.
You could just add:
<div id="display" class="numberFont" style="text-align:right"></div>
Inline styles take precedence over CCS on IDs which take precedence over CSS on CLASSES.
Oh, wow-- (amaze!) So please do take a second and explain-- The chars are totally put together by ‘divs’ and really no ‘text’-- So why does a ‘text-align’ work here ?
Not sure what you mean? If there is some text inside the div it gets aligned.
I should add ‘numberfont’ is an artifact from my initial testing. I need to clear that out as it is no longer used once I went to seven seg.
Maybe I am misunderstanding ‘too’… But you see my ‘append’ method… There is no ‘text’, but a lot of ‘divs’… So ‘text = divs’ ?
I don’t know. CSS alignment is a pain. That’s why I am using flexbox and grid from now on.
Ha. I don’t quite get either… Why also a point I wanted to stress. I’ve put a lot into this design, but also gotten ‘lost’ on something rather ‘stupid’.
No one is ‘alone’ and thank you–
I follow this guy Harry Roberts @csswizardry on twitter who was recommended in a course I watched:
Here are his CSS guidelines.
I recommend the “General Rules”
1 Like