This lesson, we're going to be applying styling to the elements we created in the previous lesson,
so I don't want to spend too much time on the styling because of course, this is a JavaScript course,
but because we are making game, it is important that the content looks presentable and that's all part
of it, that it actually looks like a game.
So let's update some of the values within the styling.
We're going to create the main container as position, relative height, so we'll set it to 90 Veach.
So that's the vertical height and weight can be 90 percent.
Then I'll do a left five percent and that will center the main container and then set of background
color.
And we can just set that to we can just set that to beat.
And I do usually like to add box shadows because I think it creates a nice effect.
So let's refresh.
Try that.
So there's our main container.
Let's also update the basket.
So this is the player's main element object and this has to be position absolute.
So this would give us the ability to move it around, could set a height and a width of that element.
You can also adjust these as needed.
I'll give it a background color of red so it stands and also apply box shadow to it the same box.
So let's refresh.
So there's our player object.
Next, we're going to update the button.
So sit this as an inline block, add some padding and also a border border can be black and adjust the
colors, make it nice and big readable.
So large font size text align center and we'll add in a text line into the main container as well so
that we center that element.
So now it's nice and center.
So we've got a nice big green button.
I'm going to add in one more class into the top bar and this is where all of the score is so we can
text, align center that add a bit of padding to it, can update the font family as well as the font
size to be larger size.
So let's refresh.
So now we've got our score.
We've got the number of enemies left.
So all of that is being presented on the page.
So we're ready to move on to the next lesson.
You can apply the styling as needed.
You don't have to do the same styling as I've done.
This is just some basic styling so that it looks more like a game.
So go ahead and add that into your project.
And coming up next, we're going to jump back into the JavaScript and make things happen.