[Support request] Full container shadow over main navigation shadow

[Slaven]

Hello, how to z-index full container shadow over main navigation shadow. I would like to remove shadow on main navigation left and right to have full container shadow on left and right side of main navigation.

I’m using this CSS code for main navigation shadow

.main-navigation {
	position: relative;
	z-index: 98;
	padding-top: 10px;
	padding-bottom: 10px;
 -webkit-box-shadow: 0 0 3px rgba(22,32,32,.12), 0 1px 2px rgba(22,32,32,.24);
    box-shadow: 0 0 3px rgba(22,32,32,.12), 0 1px 2px rgba(22,32,32,.24);
}

nav#sticky-navigation {
-webkit-box-shadow: 0 0 6px rgba(22,32,32,.16), 0 3px 6px rgba(22,32,32,.23);
    box-shadow: 0 0 6px rgba(22,32,32,.16), 0 3px 6px rgba(22,32,32,.23);
}

.sticky-enabled .main-navigation.is_stuck {
-webkit-box-shadow: 0 0 6px rgba(22,32,32,.16), 0 3px 6px rgba(22,32,32,.23);
    box-shadow: 0 0 6px rgba(22,32,32,.16), 0 3px 6px rgba(22,32,32,.23);
}

And this for full container shadow

.full-container {
      box-shadow: -2px 0 10px rgba(188,190,202,0.32);
}

GeneratePress 2.2.2

GP Premium 1.7.8

[David]

Hi there,

so you want to keep the shadow below the nav and just remove it from the sides?
If so you can add a overflow-x: hidden; property to your .full-container

Sticky will be more tricky as its a fixed element so it effectively be outside of the full container. One fix is to use a negative value for the spread radius value. This will stop it from expanding out the edges.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts