Select Box will not hide Vertical Scroll Bar

pizzipie · 09-13-2021, 08:31 PM

Trying to hide vertical scroll bar in a 4-choice Select Box. My css is not working. See attachment for screenshot.

CSS for select is below. Any help appreciated.
R

Code:

input[type=text], select {
  display: inline-block;
  width: 75%;
  padding: 5px;
  margin: 2px 0;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  font-size: 20px;
  font-weight: bold;
  background-color: var(--box-bgcolor);
  color: blue;
}

select {
	overflow-y: auto;
}

astrogeek · 09-14-2021, 05:54 PM

Quote:

Originally Posted by pizzipie

Trying to hide vertical scroll bar in a 4-choice Select Box. My css is not working. See attachment for screenshot.

CSS for select is below. Any help appreciated.
R

Code:

input[type=text], select {
  display: inline-block;
  width: 75%;
  padding: 5px;
  margin: 2px 0;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  font-size: 20px;
  font-weight: bold;
  background-color: var(--box-bgcolor);
  color: blue;
}

select {
	overflow-y: auto;
}

CSS overflow-y property

... from which I suspect that it is doing exactly what you told it to do given the size of the list, border, padding and margin constraints.

Have you tried hidden to see what is overflowing and whether the scrollbar disappears?