nsdlfefinedieicbe nsdlfefinedieicbe - 5 months ago 10
CSS Question

display two line of shadow if text is one line also

we are displaying text on image & we are giving shadow for that text here.

if text is two lines, than it will display shadow for two lines.

enter image description here

if text is one line, than it will display shadow for one line

enter image description here

what we need is we want to display two line of shadow if text is one line also.

.fanbook-name {
background: rgba(255, 255, 255, 0.5); /* add this */
bottom: 0;
position: absolute;
text-align: center;
width: 100%;
z-index: 1;
}
.fanbook-name b {
/* bottom: 25px; */
color: #000;
font-size: 12px;
/* position: relative; */
text-transform: capitalize;
}

.fanbook-image li {
float: left;
margin-bottom: 1%; /* change this */
margin-left: 0.5%;
margin-right: 0.5%;
position: relative; /* add this */
width: 24%;
}

Answer

Set a min-height with the value of the line-height * 2 calculation. Easy.