IvanU7n в комментарии подсказал, что flex умеет всё, что нужно, и на рендеринге это похоже на правду. Там есть те же fill-content и
flex-grow:1 (вместо
width: 100%), просто в отличие от table-cell это работает даже на
<select>
Ответ
<!DOCTYPE html>
<html lang="ru" style="height:100%;">
<head>
<meta charset="utf-8">
<title>Полигон</title>
<!--
<link href="stypes.css" rel="stylesheet">
<script src="script.js"></script>
-->
<!--<script type="module" src="/static/vue.js"></script>-->
<style>
</style>
</head>
<body style="height:100%;margin:0;">
<div style="display:flex;flex-direction:row;flex-wrap:nowrap;width:100%;">
<button style="flex:0 1 fit-content;background-color:lightgray;"
>setraw
</button>
<select
style="flex-grow:1;background-color:lightyellow"
>
<optgroup>
<option>Select-remaining</option>
<option>many1</option>
<option>many2</option>
<option>many3</option>
</optgroup>
</select>
<button
style="flex:0 1 fit-content;background-color:lightblue"
>vsplit
</button>
</div>
</body>
<script>
</script>
</html>