RadMenu and transparent images

[gert]

Hi,

I would like to put the text property of the menu, underneath the image of the menu. Please help





Menu Html:

<div id="ctl00_RadMenu1" class="RadMenu RadMenu_" style="top: -2px; left: 0px;
                                            height: 26px">
    <!-- 2010.3.1109.40 --><ul class="rmRootGroup rmHorizontal">
        <li class="rmItem rmFirst"><a href="#" class="rmLink rmRootLink"><img alt="" src="../Images/button_home_on.jpg" class="rmLeftImage" /><span class="rmText">Home</span></a><div class="rmSlide">
            <ul class="rmVertical rmGroup rmLevel1">
                <li class="rmItem rmFirst"><a href="1About.aspx?cat=directAbout" class="rmLink menuItems"><span class="rmText">About BJM</span></a></li><li class="rmItem "><a href="1About.aspx?cat=directStockBroking" class="rmLink menuItems"><span class="rmText">Stock Broking</span></a></li><li class="rmItem "><a href="1AboutArt.aspx?art=1053338" class="rmLink menuItems"><span class="rmText">Contracts for Difference (CFD's)</span></a></li><li class="rmItem "><a href="1About.aspx?cat=directPersonal" class="rmLink menuItems"><span class="rmText">Personal Portfolios</span></a></li><li class="rmItem "><a href="1About.aspx?cat=directMulti" class="rmLink menuItems"><span class="rmText">Multi-Managed Funds</span></a></li><li class="rmItem "><a href="1About.aspx?cat=directOffshore" class="rmLink menuItems"><span class="rmText">Offshore Investments</span></a></li><li class="rmItem "><a href="1About.aspx?cat=directAlternative" class="rmLink menuItems"><span class="rmText">Alternative Investments</span></a></li><li class="rmItem "><a href="1AboutArt.aspx?art=1072714" class="rmLink menuItems"><span class="rmText">Cash Management Solutions</span></a></li><li class="rmItem "><a href="1About.aspx?cat=directCharitable" class="rmLink menuItems"><span class="rmText">Charitable Giving Service</span></a></li><li class="rmItem "><a href="1About.aspx?cat=directArt2010" class="rmLink menuItems"><span class="rmText">BJM Primary School Art Competition</span></a></li><li class="rmItem "><a href="1About.aspx?cat=directPress" class="rmLink menuItems"><span class="rmText">BJM in the Press</span></a></li><li class="rmItem "><a href="1About.aspx?cat=directNewsletters" class="rmLink menuItems"><span class="rmText">BJM Newsletters</span></a></li><li class="rmItem rmLast"><a href="1About.aspx?cat=directBlogs" class="rmLink menuItems"><span class="rmText">BJM Blogs</span></a></li>
            </ul>
        </div></li><li class="rmItem "><a href="#" class="rmLink rmRootLink"><img alt="" src="../images/button_blank_off.jpg" class="rmLeftImage" /><span class="rmText">Markets</span></a><div class="rmSlide">
            <ul class="rmVertical rmGroup rmLevel1">
                <li class="rmItem rmFirst"><a href="../menuMarkets/1SAOverview.aspx" class="rmLink menuItems"><span class="rmText">SA Overview</span></a></li><li class="rmItem "><a href="../menuMarkets/1MarketIndice.aspx" class="rmLink menuItems"><span class="rmText">Market Indices</span></a></li><li class="rmItem "><a href="../menuMarkets/1Constituent.aspx" class="rmLink menuItems"><span class="rmText">Sector Constituents</span></a></li><li class="rmItem "><a href="../menuMarkets/1MarketActive.aspx" class="rmLink menuItems"><span class="rmText">Most Actives</span></a></li><li class="rmItem "><a href="../menuMarkets/1MarketGL.aspx" class="rmLink menuItems"><span class="rmText">Gainers &amp; Losers</span></a></li><li class="rmItem "><a href="../menuMarkets/1ShareCommentary.aspx" class="rmLink menuItems"><span class="rmText">Share Commentary</span></a></li><li class="rmItem "><a href="../menuMarkets/1MarketWarrants.aspx" class="rmLink menuItems"><span class="rmText">Warrant Activity</span></a></li><li class="rmItem "><a href="../menuMarkets/1FixedInterest.aspx" class="rmLink menuItems"><span class="rmText">Fixed Interest</span></a></li><li class="rmItem "><a href="../menuMarkets/1Commodities.aspx" class="rmLink menuItems"><span class="rmText">Commodities</span></a></li><li class="rmItem "><a href="../menuMarkets/1Currency.aspx" class="rmLink menuItems"><span class="rmText">Currencies</span></a></li><li class="rmItem rmLast"><a href="../menuMarkets/1SASens.aspx" class="rmLink menuItems"><span class="rmText">SENS Releases</span></a></li>
            </ul>
        </div></li><li class="rmItem "><a href="#" class="rmLink rmRootLink"><img alt="" src="../images/button_blank_off.jpg" class="rmLeftImage" /><span class="rmText">Quotes and Research</span></a></li><li class="rmItem "><a href="#" class="rmLink rmRootLink"><img alt="" src="../images/button_blank_off.jpg" class="rmLeftImage" /><span class="rmText">Portfolios</span></a><div class="rmSlide">
            <ul class="rmVertical rmGroup rmLevel1">
                <li class="rmItem rmFirst"><a href="../menuPortfolio/1Portfolio.aspx" class="rmLink menuItems"><span class="rmText">Portfolio Manager</span></a></li><li class="rmItem rmLast"><a href="../menuPortfolio/1PortCreate.aspx" class="rmLink menuItems"><span class="rmText">Create / Modify WatchList</span></a></li>
            </ul>
        </div></li><li class="rmItem "><a href="#" class="rmLink rmRootLink"><img alt="" src="../images/button_blank_off.jpg" class="rmLeftImage" /><span class="rmText">Trading</span></a><div class="rmSlide">
            <ul class="rmVertical rmGroup rmLevel1">
                <li class="rmItem rmFirst"><a href="../menuTrading/1Trade.aspx" class="rmLink menuItems"><span class="rmText">Enter Equity Order</span></a></li><li class="rmItem "><a href="../menuTrading/1OpenOrders.aspx" class="rmLink menuItems"><span class="rmText">Open Orders</span></a></li><li class="rmItem "><a href="../menuTrading/1History.aspx" class="rmLink menuItems"><span class="rmText">Trading History</span></a></li><li class="rmItem "><a href="../menuTrading/1MultiManagerTransactionHistory.aspx" class="rmLink menuItems"><span class="rmText">My Transactions</span></a></li><li class="rmItem rmLast"><a href="../menuTrading/1MultiManagerFundHome.aspx" class="rmLink menuItems"><span class="rmText">BJM Multi Manager Funds</span></a></li>
            </ul>
        </div></li><li class="rmItem "><a href="#" class="rmLink rmRootLink"><img alt="" src="../images/button_blank_off.jpg" class="rmLeftImage" /><span class="rmText">Account Information</span></a><div class="rmSlide">
            <ul class="rmVertical rmGroup rmLevel1">
                <li class="rmItem rmFirst"><a href="../menuAccount/1Account.aspx" class="rmLink menuItems"><span class="rmText">Account Summary</span></a></li><li class="rmItem "><a href="../menuAccount/1AccountPerf.aspx" class="rmLink menuItems"><span class="rmText">Account Performance</span></a></li><li class="rmItem "><a href="../menuAccount/1AccountActivity.aspx" class="rmLink menuItems"><span class="rmText">Account Activity</span></a></li><li class="rmItem "><a href="../menuAccount/1OrderHistory.aspx" class="rmLink menuItems"><span class="rmText">Order History</span></a></li><li class="rmItem "><a href="../menuAccount/1Reports.aspx" class="rmLink menuItems"><span class="rmText">Reports</span></a></li><li class="rmItem "><a href="../menuAccount/1ReportsEBN.aspx" class="rmLink menuItems"><span class="rmText">Contract Notes</span></a></li><li class="rmItem "><a href="../menuAccount/1CashTransfer.aspx" class="rmLink menuItems"><span class="rmText">Cash Transfer</span></a></li><li class="rmItem "><a href="../menuAccount/1AlertView.aspx" class="rmLink menuItems"><span class="rmText">View Alerts</span></a></li><li class="rmItem "><a href="../menuAccount/1AlertCap.aspx" class="rmLink menuItems"><span class="rmText">Set Alerts</span></a></li><li class="rmItem "><a href="../menuAccount/1ViewFica.aspx" class="rmLink menuItems"><span class="rmText">FICA Compliance</span></a></li><li class="rmItem rmLast"><a href="../menuAccount/1ViewMandate.aspx" class="rmLink menuItems"><span class="rmText">Online Mandate</span></a></li>
            </ul>
        </div></li><li class="rmItem rmLast"><a href="#" class="rmLink rmRootLink"><img alt="" src="../images/button_blank_off.jpg" class="rmLeftImage" /><span class="rmText">Personal Details</span></a><div class="rmSlide">
            <ul class="rmVertical rmGroup rmLevel1">
                <li class="rmItem rmFirst"><a href="../menuPersonal/1Personal.aspx" class="rmLink menuItems"><span class="rmText">Personal Details</span></a></li><li class="rmItem "><a href="../menuPersonal/1ChangePwd.aspx" class="rmLink menuItems"><span class="rmText">Change Password</span></a></li><li class="rmItem "><a href="../menuPersonal/1ChangeUser.aspx" class="rmLink menuItems"><span class="rmText">Change Username</span></a></li><li class="rmItem "><a href="../menuPersonal/1AccServices.aspx" class="rmLink menuItems"><span class="rmText">Set Preferences</span></a></li><li class="rmItem rmLast"><a href="../menuPersonal/1AlertDelOpt.aspx" class="rmLink menuItems"><span class="rmText">Delivery Options</span></a></li>
            </ul>
        </div></li>
    </ul><input id="ctl00_RadMenu1_ClientState" name="ctl00_RadMenu1_ClientState" type="hidden" />
</div>

[Kate]

Hi Gert,

Can you please elaborate on your scenario? For example by looking at the image that you attached I am not quite sure what you refer to as "an image of the menu" and "text property of the menu"? Can you also provide a live url where we can inspect the issue and help you out?    

Best wishes,
Kate
the Telerik team

[gert]

I cannot provide a live url, but this is what I would like to achieve.
http://www.alistapart.com/articles/slidingdoors/
Does that help. Text of the href must be shown inside the image of the tab menu

[Kate]

Hello Gert,

To achieve the appearance that is implemented in the post you can simply use our RadTabStrip control where we have already implemented this appearance. Further if you need to customize it you can refer to the following help article where it is explained in details how this could be done.

Greetings,
Kate
the Telerik team