Day 27: Picasso Painting

Day 27. We still keep our gloves on. 10 steps for today.

1. Remember the last div we worked on yesterday, yea the one with id black-hat, I created a border-width attribute for it. The border-width sets the width for the four borders of the element.

1. I styled the border for the black-hat element using the attributes border-top-color, border-left-color ……

1. Next steps is to position the element using the attributes position, left and top with their corresponding values.

1. I then styled the element with id gray-mask. Width, height and background-color where giving values.

1. Time to position the element. Can you guess the attributes we would be using…..position, left and top. You guessed right.

1. I went on to style a new div with id white-paper giving it width, height and background-color attributes.

1. Next is positioning. I know you already know what to do. Use the attributes position, top and bottom.

1. Remember, I told you about an attribute that controls the orderliness of overlapping. Yes dear, Z-index, I used it in this step.

1. FontAwesome icons come with their own styling however, you can change the style to whatever you desire. That brings us to the next step – styling the fa-music.

1. Last step for the day, I created two divs below the black-character div.

Thank you following along. If you have questions please drop them in the comment section.