CSS Problem- Help Anyone?

I’m trying to create a “level bar” , kind of like what they put in resumes, wherein the class “skills” has a gray background then set any color i like to the corresponding div class (html, css, js).

My problem is my container “divs” won’t show up in a live page but the “p” and “img” elements show up just fine.

I’m using a grid layout (if that helps).

                        <img src="./assets/HTML5_logo_and_wordmark.svg">
                        <div class="skills">
                            <div class="html"></div>

                        <img src="./assets/CSS3_logo_and_wordmark.svg">
                        <div class="skills">
                            <div class="css"></div>


    width: 100%;
    background-color: gray;
    border-radius: 20%;

.html {
    width: 80%;
    background-color: red;
    border-radius 20%;


---and so on

The divs are empty, if you add some content or give them a height you can see them.

1 Like

damn, that was dumb of me.

thanks btw! cheers

I really don’t think that there should be a valid class called “html”. the reason why it doesn’t show up is because you need to add the following code:
top:[however many pixels you want]px;
left:[however many pixels you want]px;
width:[however many pixels you want]px;
height:[however many pixels you want]px;