Horizontal scroll in Select for any browser

Question

Horizontal scroll in Select for any browser

Navigation

#1 by (1 votes)
#2 by (0 votes)

1

I want to add a horizontal scroll in a select element. The code that I show you below works properly in chrome, however it does not work in firefox or ie.

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="estilo.css"> 
</head> 
    <body> 
        <select id="select" name="select" size ='3'>
          <option value="value1">LUNES</option> 
          <option value="value2">MARTES</option>
          <option value="value3">MIERCOLES</option>
        </select>
    </body> 
</html>

and the following css:

.select{
     width: 100px; 
     overflow: auto;
     height: 70px; 
}

If anyone knows a common solution for all browsers, I'd appreciate it.

html css navegador-web

asked by Jusan 13.10.2016 в 22:19

source

2 answers

bash syntax error jplayer does not work on safari [closed]

score 1 · Answer 1

You should use

#select{
     width: 100px; 
     overflow: auto;
     height: 70px; 
   }

The numeral symbol (cat) indicates that you are looking for the item that has select as the value of its id

attribute

Or failing

select{
         width: 100px; 
         overflow: auto;
         height: 70px; 
       }

Without a point that indicates that you are going to affect all the select elements

score 0 · Answer 2

You could solve it with a container with horizontal scroll as a parent box.

CSS Code

#select_list{
    width: 100px;
    overflow-x: hidden;
    overflow-y: auto;
}

HTML code

<div id="select_list"> 
    <select id="select" name="select" size ='3'>
       <option value="value1">LUNES</option> 
       <option value="value2">MARTES</option>
       <option value="value3">MIERCOLES</option>
    </select>
</div>