Hit Hit - 2 months ago 8
CSS Question

make span tag show full background instead wrapping in responsive

In responsive

span
is not showing full background.

It shows proper up to 836 pixels after less than that it wraps in another line, I want that only wrap text not background.

How to show full background?

Snippet



span{
background: red;
color: white;
padding: 50px;
border-radius: 5px;
text-align: center;
font-family: arial;
font-size: 20px;
}

<span>In responsive span is not showing full background. How to show full background?</span>




Answer

set inline-block to span, because span is an inline element

span{
  background: red;
  color: white;
  padding: 50px;
  border-radius: 5px;
  text-align: center;
  font-family: arial;
  font-size: 20px;
  display:inline-block
}
<span>In responsive span is not showing full background. How to show full background?</span>

Comments