如何在下拉框中正确添加独特的设计元素并将其正确移植到wordpress？

Question

第一次在这里发帖。我想知道如何在下拉框中正确添加独特的设计元素？如果你看一下附加的图像示例。图像A在下拉框的顶部有一个指向链接的小三角形。这是我编写的内容。当我将导航移植到WordPress时，该独特元素（三角形）消失（图像B）。我正在使用Bootstrap Navwalker在Wordpress中制作菜单。

<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<div class="gold-triangle"></div>
  <a class="dropdown-item active" href="admissions.html">Admission 
 Process</a>
  <a class="dropdown-item pt-2" href="tour.html">Visit Our School</a>
  <a class="dropdown-item pt-2" href="tuition.html">Tuition &amp; 
     Fees</a>
</div>

三角形的CSS代码

    .navbar-custom .dropdown-menu .gold-triangle {
      width: 0em; height: 0em; border-left: 12px solid transparent;
      border-right: 12px solid transparent;
      border-bottom: 12px solid #CCCC9A;
      margin-top: -0.75em;
      position: relative;
     }

下拉框的CSS代码

    .navbar-custom .dropdown-menu { 
      background-color: #CCCC9A; 
      border-radius: 0.1875em;
      border: 0em;
      padding: 0.75em, 0, 0.875em, 0;
      width: 11.25em;
      margin-top: -0.1875em;
      margin-left: 2.1875em;
      box-shadow: 0em 0.0625em 0.1875em rgba(0, 0, 0, 0.4);
     }