Can anyone help me create a LIKE button that is aligned in the middle center with text and image? I'm struggling with responsiveness and it's driving me crazy.
I feel like I might be overcomplicating things. Can someone simplify it for me and make it scale with % for responsiveness?
This is what I envision: https://i.sstatic.net/oTJps.jpg
And this is what I currently have: https://i.sstatic.net/WSRSV.jpg
.kom_augsha .treshais{
width:15%;
float:right;
}
.reitings{
display:table;
width: 100%;
border: 1px solid #e9e9e9;
}
.rate {
display: table-cell;
text-align: center;
vertical-align:middle;
line-height: 1.5em;
}
.plus {
background: white;
color: green;
}
.minus{
background: white;
color: red;
border-left: 1px solid #e9e9e9;
padding-left:10px;
text-align:center;
}
<div class="treshais">
<div class="reitings">
<div class="rate plus"><img src="plus.jpg"/>83</div>
<div class="rate minus"><img src="minus.jpg"/>9</div>
</div>
</div>