Arrange Folder Drop-Down Top-to-Bottom instead of Left-to-Right

Site URL: https://michaelkelleher.co/

Hey guys, site is running 7.1. The folder drop-down menu for "Properties" is displaying left-to-right and I just can't figure out how to configure it Top-to-Bottom instead. I would have thought this was the standard arrangement. Appreciate the help.

https://michaelkelleher.co/

1 hour ago, MchlKllhr said:

The folder drop-down menu for "Properties" is displaying left-to-right and I just can't figure out how to configure it Top-to-Bottom instead.

This is because of the custom CSS you have added, specifically the float property. Removing your custom CSS will fix this. 🙂

20 hours ago, paul2009 said:

This is because of the custom CSS you have added, specifically the float property. Removing your custom CSS will fix this. 🙂

If you don't mind me asking, is there any way I can keep the floating header and change the arrangement of the dropdown folder? Custom CSS I have loaded is below.

Quote

// Frosted Blur Header //

.header {
   background: rgba(0,0,0,.4) !important;
   box-shadow: 0px 5px 15px rgba(100,100,100,0.0) !important;
   backdrop-filter: blur(12px) !important;
   -webkit-backdrop-filter: blur(12px) !important;
}

// Frosted Blur Header - When Fixed and Scrolling //

.header.shrink {
   background: rgba(0,0,0,.4) !important;
   box-shadow: 0px 5px 15px rgba(100,100,100,0.0) !important;
   backdrop-filter: blur(12px) !important;
   -webkit-backdrop-filter: blur(12px) !important;
}

// Left Nav Line //

@media all and (min-width:770px){
header nav a{
  display: inline-block !important; 
  float: left;
}
header nav a:hover:after{
  transform: scaleX(1);
  }
header nav a:after {
  display:block;
  content: '';
  border-bottom: solid 1px #ffffff;  
  transform: scaleX(0);  
  transition: transform 250ms ease-in-out;
  z-index: 999;
  transform-origin :0% 100%;
 }
}

// Right Align Mobile Menu Links //

.header-menu-nav-item a {
text-align: right;
}

// Shrinking Logo On Scroll - 7.1 //

.header.shrink img {
    max-width: 300px;
    transition: all 0.3s ease-in-out
}

.header img {
    transition: all 0.3s ease-in-out
}