Блог

Я пытаюсь использовать выпадающее меню в приложении react. Кажется, все работает нормально, но одна вещь беспокоит меня, когда я пытаюсь изменить разрешение браузера с консоли.

 // index.js: lt;select  id="project_type"  name="project_type"  className="dropdown_menu"} gt;  lt;option value="Yes"gt;  Yes  lt;/optiongt;  lt;option value="No"gt;  No  lt;/optiongt; lt;/selectgt;  

файл css:

 .dropdown_menu {  position: absolute;  width: 590px;  height: 48px;  background: rgba(0, 50, 160, 0.1);  margin-top: 270px;  border-radius: 5px;  border: 1px solid rgba(46, 81, 158, 0.6);  padding-left: 23.33px;  padding-top: 0; }  

Это происходит, когда я пытаюсь изменить разрешение:

Как я могу сделать выпадающее меню равной ширины его раскрывающегося списка вместо переполнения при изменении разрешения.

Примечание: Я использовал «ширина: наследование», но это не работает.

Просто используйте content-box

 input, select {  -moz-box-sizing: content-box;  box-sizing: content-box; } 

 lt;select id="project_type" name="project_type" className="dropdown_menu" }gt;  lt;option value="Yes"gt;  Yes  lt;/optiongt;  lt;option value="No"gt;  No  lt;/optiongt; lt;/selectgt;