Small question regarding width

HTML-CSS
1

Here in my project (https://codepen.io/verv0eren/full/WNNwgJd), even though, I have kept width of 80% for both input element and select element for screen of max-width: 770px, they are of different width at that screen size. What may be the reason?

@media screen and (max-width: 770px) {
  .input-box {
    width: 80%;
  }
  .drop-down {
    width: 80%;
  }
}
2

I think maybe because class ‘dropdown’ is misspelled in your css.

2 Likes
3

to connect elements from html to css the value of your id needs to be the same
and the usage of . # can also make a diffrence if the two are connected our not

4

Oh my god! thanks. Strangely, if I may bother you with one thing more : if you use element selector select { } instead of class selector, it doesn’t work.

5

I’ve no clue about that. Sorry

Edit: seems to be working just fine even with the element selector.