Customizing the height and width of an element in MoodleCloud with CSS

We can customize the height and width of an element in MoodleCloud with CSS. In this example, we will customize the logo that we have already inserted. As we have learned how to find the information to change withing CSS code we will do it in our MoodleCloud. After logging in MoodleCloud, these are the steps that we have to follow:

1. Under Site administration, click on Appearance | Themes| Moodlecloud.

2. Scroll down until you find Custom CSS, as shown in the following screenshot:

   

3. The code reads as follows:

         div.logo { 
           height: 158px; 
    
           margin-bottom: 20px; 
           float: none; 
         } 
   

4. Highlight 158px and change it to 100px, as shown in the following screenshot:

   

5. Scroll down and click on Save changes. The logo's size is as shown in the following screenshot: