Search block width setting does not work the first time the px value is updated

[carolinan]

Description

Originally reported on WordPress Trac: https://core.trac.wordpress.org/ticket/60775

Search block having issue with the width when we add first time. Steps to reproduce the issue :- Activate Twenty Twenty theme. Choose Search block. Give Width in px without change it in % or anything apply as defalut. Now check both the side editor and front. You can able to see no difference in width of search block. Now change the width from the given option for example :- 25% You can able to see a difference in editor and front end both. Now change width paramater which is changed in %, Make it px and then change value. You can able to see difference in width of search block in editor and front both the side. I have attached video for better understanding. Video URL :- https://share.cleanshot.com/hVRc9FjRz5PnKPCsVhrs

Step-by-step reproduction instructions

Activate Twenty Twenty theme. Choose Search block. Give Width in px. Now check both the side editor and front.

Screenshots, screen recording, code snippet

No response

Environment info

WordPress 6.43, 6.5, 6.6 alpha.

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[annezazu]

Thanks so much for bringing this over. Not adding this to the 6.5.x board considering this was present in 6.4.3.

[amitraj2203]

Hi @carolinan I have raised a PR for this issue. I found that the search block's CSS in the editor sets a minimum width of 220px to maintain styling integrity. Extending this to the frontend addresses the issue. Please let me know if it needs improvement.

Thanks!