Что нужно сделать, чтобы выпадающий список select отображался только вниз?

Question

Что нужно сделать, чтобы выпадающий список select отображался только вниз? В данном случае он отображается наверх

div {
  position: absolute;
  right: 50%;
  top: 60%;
}

.select {
  width: 100px;
  height: 50px;
  background-color: #FFFFFF;
  font-size: 30px;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div>
        <select class="select">
            <option value=""></option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
        </select>
    </div>
</body>
</html>

Answer 1

div {
  position: relative; 
}

.select {
  width: 100px;
  height: 50px;
  background-color: #FFFFFF;
  font-size: 30px;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div>
        <select class="select">
            <option value=""></option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
        </select>
    </div>
</body>
</html>

БЛОГ НА HUSL

Что нужно сделать, чтобы выпадающий список select отображался только вниз?

Ответы (1 шт):