I have a list of elements with icons added as background for :before. The text coming under the image when the title length is large.
How can I made the word services just below consultancy?
li>a {
position: relative;
display: block;
}
.submenu-icon:before {
content: "";
margin-right: 0px;
background: url(/sites/all/themes/bootstrap_cck/images/sprites.png) no-repeat;
background-size: 40em;
background-position: -250px -184px;
padding: 15px 40px 12px 15px;
display: inline-block;
vertical-align: middle;
line-height: 47px;
width: 55px;
height: 47px;
}<li class="first">
<a href="Consultancy-professional-services" class="submenu-icon">Consultancy & Professional Services </a>
</li>