I am confused why the first button doesn’t fill the whole width here:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div style="display:flex;">
<button style="width:100%;"> </button>
<button style="flex-shrink: 0;"> </button>
<button> </button>
</div>
</body>
</html>
Why does flexbox interrupt the width?