Hi Guys,
I've tried to change the background of the submenu to semi transparent with CSS.
This however doesn't work for me.
What do I have to change to make the submenu items transparent.
Code: |
/*
* Ext Core Library Examples 3.0
* http://extjs.com/
* Copyright(c) 2006-2009, Ext JS, LLC.
*
* The MIT License
*
*/
.ux-menu-init-hidden
{
visibility:hidden;
position:absolute;
}
.ux-menu-container
{
position:relative;
background-color:#000;
}
.ux-menu,.ux-menu ul
{
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;padding:0;
line-height:1;
}
.ux-menu li
{
position:relative;
float:left;
}
.ux-menu ul
{
position:absolute;
top:0;
left:0;
}
.ext-border-box .ux-menu-ie-iframe,.ext-ie7 .ux-menu-ie-iframe
{
padding:0;
margin:0;
position:absolute;
top:0;
left:0;
display:none;
z-index:-1;
}
.ux-menu-vertical .ux-menu-item-main
{
clear:left;
}
.ux-menu a
{
display:block;
position:relative;
text-decoration:none;
color:#fff;
border-left:1px solid #000;
border-top:1px solid #000;
border-bottom:1px solid #000;
font-size:12px;
line-height:12px;
padding:13px 14px;
}
.ux-menu a.ux-menu-link-last
{
border-right:1px solid #000;
}
ux.menu ul a
{
width:100%;
}
.ux-menu a:focus,.ux-menu a:hover,.ux-menu a.ux-menu-link-hover
{
border-color:#000;
background-color:#000;
outline:0;
}
.ux-menu-clearfix:after
{
content:".";display:block;
height:0;
clear:both;
visibility:hidden;
}
.ux-menu a.ux-menu-link-parent
{
padding-right:24px;
min-width:1px;
}
.ux-menu ul a,.ux-menu.ux-menu-vertical a
{
border-bottom:0;
border-right:1px solid #000;
}
.ux-menu ul a.ux-menu-link-last,.ux-menu.ux-menu-vertical a.ux-menu-link-last
{
border-bottom:1px solid #000;
}
.ux-menu-arrow
{
display:block;
width:8px;
height:6px;
right:10px;
top:14px;
position:absolute;
background:url(images/menu-arrow-down.png) no-repeat;
font-size:0;
}
.ux-menu.ux-menu-vertical .ux-menu-arrow,.ux-menu ul .ux-menu-arrow
{
width:6px;
height:8px;
top:13px;
background:url(images/menu-arrow-right.png) no-repeat;
}
.ext-border-box .ux-menu-arrow
{
top:17px;
}
.ext-border-box .ux-menu.ux-menu-vertical .ux-menu-arrow,.ext-border-box .ux-menu ul .ux-menu-arrow
{
top:16px;
}
.ux-menu ul.ux-menu-hidden
{
display:none;
}
.ux-menu a.current
{
background-image:url('images/menu-item-bg-current.png');
border-color:#000;
}
|
Br,
Steve