Button setting block, does not have fluidity (that is, width 100%)

Mar.04,2021

the block element is fluid (normally)
button is not a block element, so it does not have
display:block just to make the element appear as a block element. To put it bluntly, it is to wrap the line
display:block is not equal to block element , so it cannot be full.

personal opinion


this is determined by the specification

for block-level replacement elements

The used value of 'width' is determined as for inline replaced elements. Then the rules for non-replaced block-level elements are applied to determine the margins.
The

width is still calculated as an inline element, but the margin is calculated as a block-level element. The default auto is generally its intrinsic value, and the width of the button element may be the width of its inner font, plus the default inner margin and the width of the border

.

while ordinary block-level elements have fluid properties because when their width is auto

'margin-left' +' border-left-width' + 'padding-left' +' width' + 'padding-right' +' border-right-width' + 'margin-right' = width of containing block
Menu