Controlling background-images

I’ve been on something of a CSS/design kick for the past few days, mainly to clear my head from all of the coding challenges we’re doing at Lambda with Python on CodeSignal. Over the past two weeks, we went over array & string manipulation, linked lists (singly, doubly and circular), queues, stacks, searching and recursion. This also included time & space complexity for each data structure’s basic operations and things like linear search vs binary search, among other things.

Its my 2nd time going through this, because of not having my photo ID to take the GCA test last time around, so I was automatically forced to repeat the unit (its called flexing). This week, Lambda announced that the GCA is no longer going to be a requirement for passing the unit, but it will be a requirement for graduation. So, I actually should be in Labs right now, not repeating data structures & algorithms, but even though I don’t love this part of the curriculum, I can see how being exposed to it again is useful.

Anyway, with that out of the way, Kevin Powell released another video yesterday. It was about controlling the positioning of background images with CSS. Like his other videos, its fantastic. This is his chapter list:

00:00 – Introduction
01:07 – background-image basics
02:08 – background-repeat and size
03:49 – background-position with units
05:11 – background-position with keywords
05:46 – keywords with offsets
07:27 – controlling multiple background images
09:14 – background-size: cover
16:14 – outro

On top of the positioning lesson, which cleared up a lot of questions for me, it showed some really interesting things that I was aware of but didn’t know how to work with – having multiple background images in a container and using CSS selectors that grab elements that start with a certain sequence of letters. I was approximating the latter by using two classes on some of my elements, or a class and an ID, but this was cuts down on code.

Leave a comment