Jump to content

menu content background


Recommended Posts

Hi everybodyI have a problem with the sub menu item backgroundPlease take a look at my sitehttp://socsci.tau.ac.il/mainspirit/It’s a Joomla site with Artisteer templateAt the top menu, the sub menu item is on a fixed width backgroundEnd its making all the sub menu items to grow outside the site bordersI need to define a background that matches the length of its contentHere is the codeI will be gratefulThanksPriya/* begin MenuItem */.art-menu ul li{ clear: both;}.art-menu a{ position:relative; display: block; overflow:hidden; height: 28px; cursor: pointer; text-decoration: none; margin-right: 1px; margin-left: 1px;}.art-menu a .r, .art-menu a .l{ position:absolute; display: run-in; top:0; z-index:-1; height: 84px; background-image: url('../images/MenuItem.png');}.art-menu a .l{ left:0; right:6px;}.art-menu a .r{ width:412px; right:0; clip: rect(auto, auto, auto, 406px);}.art-menu a .t {font-family: Tahoma, Arial, Helvetica, Sans-Serif;font-size: 12px;font-style: normal;font-weight: normal;text-transform: uppercase; color: #000000; padding: 0 10px; margin: 0 2px; line-height: 28px; text-align: center;}.art-menu a:hover .l, .art-menu a:hover .r{ top:-28px;}.art-menu li:hover>a .l, .art-menu li:hover>a .r{ top:-28px;}.art-menu li:hover a .l, .art-menu li:hover a .r{ top:-28px;}.art-menu a:hover .t{ color: #CCDDFF;}.art-menu li:hover a .t{ color: #CCDDFF;}.art-menu li:hover>a .t{ color: #CCDDFF;}.art-menu a.active .l, .art-menu a.active .r{ top: -56px;}.art-menu a.active .t{ color: #FFFFFF;}/* end MenuItem *//* begin MenuSubItem */.art-menu ul a{ display: inherit; text-align: center; white-space: nowrap; height: 26px; width: 280px; overflow: inherit; line-height: 26px; margin-right: 5px; background-color:#71c4f6; background-position: left top; background-repeat: repeat-x; border-width: 1px; border-style: ridge; border-color: #ffffff;}.art-nav ul.art-menu ul span, .art-nav ul.art-menu ul span span{ display: list-item; float: none; margin: inherit; padding: inherit; background-color:#71c4f6; text-align: inherit; text-decoration: inherit; }.art-menu ul a, .art-menu ul a:link, .art-menu ul a:visited, .art-menu ul a:hover, .art-menu ul a:active, .art-nav ul.art-menu ul span, .art-nav ul.art-menu ul span span{ text-align: right; text-indent: 12px; text-decoration: none; line-height: 26px; color: #000000;font-family: Tahoma, Arial, Helvetica, Sans-Serif;font-size: 12px;font-style: normal;font-weight: normal;}.art-menu ul ul a{ margin-left: auto; }.art-menu ul li a:hover{ color: #CCDDFF; background-position: -26px 0; background-color:#003399; }.art-menu ul li:hover>a{ color: #CCDDFF; background-position: -26px 0; background-color:#003399; }.art-nav .art-menu ul li a:hover span, .art-nav .art-menu ul li a:hover span span{ color: #CCDDFF; }.art-nav .art-menu ul li:hover>a span, .art-nav .art-menu ul li:hover>a span span{ color: #CCDDFF; clip: rect(auto, auto, auto, 406px);}/* end MenuSubItem */

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...