Adjusting width of dropdown menu

Hi there, I was wondering can anyone help me with adjusting the width of the dropdown menu? In addition, how can I adjust 
to make the background of the dropdown menu transparent/different color?

I've tried research and finding on my own but I can't find anything! Currently I'm on version 7.1 so there isn't a specific template i think. My website isn't full done yet, but here it is www.lacylashes.com 

Here is what I mean, I have attached a photo

Thanks!

Use either this piece of code to your custom CSS.

Use the rgba color if you want to add transparency to the background, adjust the alpha value from 0 (transparent) to 1 (opaque).

If you want to use a solid color, use the bottom piece of code and replace the #FFFFFF to the hex color you wish to use instead.

/** TRANSPARENT BACKGROUND **/

.header-nav-folder-content {
    background-color: rgba(203,242,246,.6);
}

/** SOLID WHITE BACKGROUND **/

.header-nav-folder-content {
    background-color: #FFFFFF;
}

Hi there, I tried these codes and it didn't affect the navigation bar at all 😞

Hi @kvn0221

Can you please share the link of your site?

Having the same issue! 

On 11/19/2019 at 2:07 AM, kvn0221 said:

Hi there, I tried these codes and it didn't affect the navigation bar at all 😞

 

Add !important at the end to the color code, it should work.

for transparent background:

.header-nav-folder-content {
    background-color: rgba(203,242,246,.6)!important;
}

for white background:

/** SOLID WHITE BACKGROUND **/

.header-nav-folder-content {
    background-color: #FFFFFF!important;
}

Hi! This what I used to make dropdown have opacity, change color, be centered & change width

.header-nav .header-nav-item--folder .header-nav-folder-content {
    width: 60px;
}

/* Change dropdown menu background */
.header-nav-folder-content {
   background: rgba(255,255,255,0.5) !important;
}

.header-nav-folder-item {
    text-align: center;
}