Get started
Loading...
Important Notice - Forums is archived

To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Product icon
TUTORIAL

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.

Where to include a web components css file when integrating a third party w by Martin Vyšný, 1 week ago
Recent Posts
Vaadin Forum3. Vaadin 6, 7, 8Framework UI

menu-items Shadow

R Madhu Sudhan
9 years ago May 11, 2012 12:03pm

Hi,

I am displaying menu-items in certain margin but it getting shadow along with menu-items . I want to remove the black shadow of the menu-items.how can it be implemented - to change the code or something changed in css file?

this is my css:

.v-menubar-submenu{
display:block;
margin-left:100px;
background-image: url(../chameleon-blue/menu-item-separator.png) repeat 0 1px;
background-color: #BCD3DE;
font-size: 15px;
color: #3F5F7C;

}

Last updated on May, 15th 2012
Madz R
9 years ago May 16, 2012 9:18am

You might want to include this bit:

text-shadow:none;
R Madhu Sudhan
9 years ago May 17, 2012 4:45am

Thanks for reply Madz R, but its not working.

Last updated on May, 17th 2012
Madz R
9 years ago May 17, 2012 8:48am

You might want to use firebug and see the structure. It is very helpful!

Thomas Hoenen
8 years ago Apr 23, 2013 8:18pm

put

.v-shadow{opacity: 0;}

in your .scss or .css That should remove the shadow from the menu.

Last updated on Apr, 23rd 2013
Jouni Koivuviita
8 years ago Apr 30, 2013 9:50am

You could try adding the margin-left: 100px to .v-menubar-popup instead, so that the shadow follows the popup correctly. Otherwise use the .v-shadow {display: none;} to hide it completely.