Breaking News: Grepper is joining You.com. Read the official announcement!

how to make editable select box in html

Abhijith answered on March 31, 2023 Popularity 6/10 Helpfulness 3/10

answer how to make editable select box in html

how to make editable select box in html

Comment

<style>
  .select-editable {
     position:relative;
     background-color:white;
     border:solid grey 1px;
     width:120px;
     height:18px;
 }
 .select-editable select {
     position:absolute;
     top:0px;
     left:0px;
     font-size:14px;
     border:none;
     width:120px;
     margin:0;
 }
 .select-editable input {
     position:absolute;
     top:0px;
     left:0px;
     width:100px;
     padding:1px;
     font-size:12px;
     border:none;
 }
 .select-editable select:focus, .select-editable input:focus {
     outline:none;
 } 
</style>

<div class="select-editable">
  <select onchange="this.nextElementSibling.value=this.value">
    <option value=""></option>
    <option value="115x175 mm">115x175 mm</option>
    <option value="120x160 mm">120x160 mm</option>
    <option value="120x287 mm">120x287 mm</option>
  </select>
  <input type="text" name="format" value=""/>
</div>
 Run code snippet

Popularity 6/10 Helpfulness 3/10 Language html

Source: stackoverflow.com

Tags: box html select

Link to this answer
Share Copy Link

Contributed on Mar 31 2023

Abhijith

0 Answers Avg Quality 2/10

how to make editable select box in html

Contents

More Related Answers

how to make editable select box in html

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.