Hello all, I’m currently having troubles adding stars to my website for its rating system. I just took over in developing the website but I am still a novice in HTML coding as I am not familiar with the PHP language. The previous developers has a rating system but recently, the code got messed up and the stars are not showing up. Not only that, a few other symbols have gone missing, like the arrow button to move to the next page. I need help and I’ll thank you all in advance .
I have attached the link to view the stars. It is at the bottom. Currently, it is 5 yellow rectangular boxes. You can click on Groceries at the home page to view the missing next page icon. It is currently just a white box now.
The anchors’ parent container has a line-height of 1.2em but its inline-block children has its own line-height 40px that affects their content. The end boxes are empty so they doesn’t get the same baseline level as those with numbers.
Though you could get the empty boxes aligned by the “vertical-align” property:
.nav-links .page-numbers {
display: inline-block;
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
border: 1px solid #ddd;
margin: 0 2px;
font-size: 12px;
vertical-align: middle; /* add this if there are empty child anchors */
}
However, if you give also those end anchors a content that can be affected by the anchors own line-height (e.g. the sign “<” and “>”) they will align by them selves.