Please click the image https://i.stack.imgur.com/HtSK6.jpg so that you understand I have marked the problem in red I want that time to automatically adjust width for example if the time is 1:25:34 then it expands to left and fill the content without overflowing. I hope you understood my css code which I have written is given below:
<span className="time">{props.time}</span>
time{
background-color: black;
color: white;
position: absolute;
top: 8.4rem;
left: 15.9rem;;
font-weight: bold;
height: fit-content;
font-size: 0.9rem;
width: fit-content;
}
Your question isn't too clear, but looking at your code it seems like you using a internal Css but it isn't in a style container Make sure all CSS codes are placed into style then into head
Since you want your container to be flexible, so as to fit into the box when it shows both the hours, minute and second, then you just add padding. This will create a gap between the text area and the borders.
Make sure to ignore width too as width is flexible
Hope this helps 👍