#move-right only does in CSS what I want it if it’s an id.
If I change it to class, then it stops working.
so if I change the css/html to .move-right this does nothing:
#move-right {
left: 5.4%;
}
Why is that? I haven’t a clue, looked my code over from top to bottom , both in html and css and it’s a mystery to me.
Also, why is it that in certain cases of trying to move an element it will only work if using px, not % .
Why is that?
It’s because id selectors are more important @agate - aka, have a higher specificity. You can lean more about specificity here. You have two selectors (at least) trying to apply styles to that element, .move-right and input[type='radio'] - the input[type='radio'] is superseding the class selector, but not the id selector. Here’s a screen shot of me looking at the dev tools on your page:
The .move-right properties are crossed out because the other ones are more important. If you want to use the class, you need to be more specific - or, you can give a property a super high specificity like this:
That will override the other properties. Hopefully, this helps.