5. Use classes to add class - How does this work?


#1



https://www.codecademy.com/en/courses/web-beginner-en-jNuXw/0/5?curriculum_id=50579fb998b470000202dc8b


I've told the border to be dashed in the CSS but it's not actually dashed, and yet it works fine?


div {
    display: inline-block;
    margin-left: 5px;
    height: 100px;
    width: 100px;
    border-radius: 100%;
    border: 2px solid black;
}

.friend{
    border:2px dashed #008000;
}
.family{
    border:2px dashed #0000ff;
}
.enemy{
    border: 2px dashed #ff0000;
}


#2

You can pass the exercise? Are you using firefox?


#3

Yeah I am using firefox. It didn't appear dashed in the example here either? Is the div class overriding it?


#4

This is a known firefox bug. dashed borders won't work when the border-radius is 50% or more.

Not much you can do about it, except from opening the exercise in another browser to see it working


#5

So why would it work on a different browser if the parent div is "border: 2px solid black;"?


#6

when i said firefox bug i meant it, this is a problem of the browser, not of your css code

Because css uses a point system if there are conflicting property's, and a class has more points then a div. In case of equal points, the last property gets applied


#7

i have the same problem but im on google chorme? idk if anyone will see this old conversation but ill try.


#8

please don't revive such an old topic, please make a new one, so we can help you


#9