CSS: Background-color on multi-line text?
I think this is what you are looking for: http://jsfiddle.net/9BTYQ/1/
span {
color: white;
background-color: #343132;
box-shadow: 0.5em 0 0 #343132,-0.5em 0 0 #343132;
}
div {
width: 100px;
}
<div>
<span>Do you have an idea to add a background-color property on a multi-line text, with two difficulties:</span>
</div>
The box-shadow
solution as shown by @gabitzish stopped working properly in IE11 and FF34+ (released 09-2014).
You can add box-decoration-break:clone;
to make it work in IE11 and FF34+ too:
p {
display: inline;
padding: 0.5em 0em;
background-color: #FFAA3B;
box-shadow: 1em 0 0 #FFAA3B, -1em 0 0 #FFAA3B;
box-decoration-break: clone;
}
Works in Webkit, Firefox, IE9+ with proper prefixes.
Demo : http://jsfiddle.net/cLh0onv3/1/
Note: Already stated this elsewhere.