Ok, so I think this is the last. I completed the course early on -- thought I would need more time, but it ended shortly after beginning this campaign. I'm going to start a new one. Going on the same lines, I suppose -- except for more exploration, experimentation, and curiosity. Maybe I'll structure it so I need to do it twice a day: once in the morning, once in the evening when I get home. And I might add a few activities as seperate Stickks. I would definitely need refs for those though. One for Language learning: my goal will be to become fluent in French and Korean by December 2018.
Thanks, Shaun, for your support on this one. Ok for another? Let me know if you're up for it. Hope you're doing well. |
|
Haha, so I didn’t link the correct css file. My goodness. Let’s see what happens.
Hey now, looks like the the whole grid stuff worked with the divs and everything.
Let’s try to do the hover now.
Almost there — have to figure out how to file the img into the right chess square.
I’m looking up object-fit. Possibly use ‘contain.’
Didn’t work, still huge. Using px’s is a little better. Much smaller.
Ohh, I can’t use box-align because I used display: grid instead of display: box.
I wonder what happens if I change that.
That’s what happens. I would need to change a few more things. But maybe a box would be simpler?
Well, I’ve learned and reviewed quite a few things and they are now much more cemented. Getting to closer to learning how to mouse hover here. |
|
I’m going to make a new html file called CheckerHover
Ok, so I wrote it all up as div, but it’s not working now. Nothing is showing up. Not possible to use div with grid? That doesn’t sound right.
I’ll keep at it. I’ll start from scratch and use the <span> tags like before, but this time I’ll make it less confusing with the order. Then I’ll make one square with a hover pseudo class and see if I can make it work. |
|
So let me try out fitting pictures to one of my checker squares.
I’ll choose the picture of myself first that’s in the htdocs folder.
Ok, so he’s creating the container at the top so that always stays the same.
Then, he’s creating the same class for each image, which he specifies one css property for; but uses the same classes for the different images he needs.
How can I use this for my checker board?
Create div class checker-container. Nest and create div class Checker-item for each of the white spaces.
In CSS, use #checker-container and specify the background color, etc. I believe this will be active until the mouse hovers and then the pseudo-class specifications will come into effect.
Ok, thinking about how you’re going to code it is half the battle. Pseudo code, I suppose.
I’ll pick up tmrw. Made progress! |
|
3178090317808731759163175436