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;