he issue occurs because display: inline doesn’t allow controlling width or height, which causes the background to appear incorrectly. To fix this, use display: inline-block or display: block.

thes code iam using to achev this result
display: inline-block;
background-color: red;
border-radius: 18px;
padding: 10px;
width: 230px;