Help allign dropdown menu

I cant center the dropdown links, tried margins but somethings blocking it. I commented out the part where i think the problem is but im not sure

https://codepen.io/levkantor/pen/RwbmYWw

@levkantor as I understand you, you want the dropdown menu to be centered horizontally to its parent of .dropdown-hover element. If so, your dropdown menu is positioned absolutely the margins won’t take effect, the solution to such problem is playing with left or right and applying a transform property.

here is the code that I think it might solve your problem:

.dropdown-menu{
  display: none;
  position: absolute;
  margin-right: 280px;
  min-width: 150px;
  left: 50%;
  transform: translateX(-50%);
  background-color: lightgray;
}

Yes it fixed it, thanks!!! So in cases when the position is set to absolute i need to use the transform: translatex() property to play with alignments?

not only transform but also left, right, top and bottom properties to. When you position an element to absolute the above mentioned properties would fix the where the element should go.