Reply To: A variety of topics


Ernest Marcinko


I think I may have found a solution for the CSS arrow, at least it seemingly works on my end.

To make it work:
1. Make sure to remove the custom CSS you added for the arrow, it will conflict with this solution. From the browser inspector, this should be removed:

content: '';
position: absolute;
border-style: solid;
border-width: 0 9px 9px;
border-color: #cccccc transparent;
display: block;
width: 0;
z-index: 0;
top: -12px;
left: 21px;

2. Add this custom CSS instead:

.asp_r {
	overflow: inherit !important;

.asp_r:after, .asp_r:before {
	bottom: 100%;
	left: 20%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	z-index: 1;

.asp_r:after {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #fff;
	border-width: 8px;
	margin-left: -8px;
.asp_r:before {
	border-color: rgba(204, 204, 204, 0);
	border-bottom-color: #ccc;
	border-width: 12px;
	margin-left: -12px;

3. Clear your cache if you use any, then reload the page. It should look like this:

Let me know how it goes. I’m not yet sure about the icons though, will try to figure out something for that as well.

Ernest Marcinko

If you like my products, don't forget to rate them on codecanyon :)