This is a migrated thread and some comments may be shown as answers.

Put the image above the text on a Menu Item

5 Answers 116 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Hind
Top achievements
Rank 1
Hind asked on 16 Sep 2011, 09:59 AM
Hello,

I would like to create a Menu in which, for each item, i would display an image above the text. Normally, the image is display to the left of the text.
How can i do to obtain the result i need?

Thank You.

5 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 2
answered on 16 Sep 2011, 11:14 AM
Hello Hind,

Try the following CSS to put the image above the text on a Menu Item.
CSS:
<style type="text/css">
.RadMenu .rmText
 {
   display:table-row !important;
 }
</style>

Thanks,
Princy.
0
Hind
Top achievements
Rank 1
answered on 16 Sep 2011, 01:59 PM
Hello,
Thank You, it is more better. But i Still have one small problem. In fact I have A White margin to the left of the Menu Item Image that I prefer to remove it.  I try to give margin-left of the .RadMenu Class some values, but it didn't change any thing.
( You can find attach the menu i create to see better the problem i mention).
Pleaze could You give me other ideas?

Thanks again,

Hind
0
Shinu
Top achievements
Rank 2
answered on 17 Sep 2011, 06:38 AM
Hello Hind,

Try setting the following CSS to display the image towards left.
CSS:
<style type="text/css">
. . . .
.RadMenu .rmLink
{
 padding-left:1px !important;
}
</style>

Thanks,
Shinu.
0
Hind
Top achievements
Rank 1
answered on 23 Sep 2011, 03:25 PM
Hello,

I try what You have suggest to me, it give me the result that u can see at the first image i attached.
Then I try to add this snippet:

.RadMenu_ProjectsMenu .rmText
{
    color:#5e6abe;
    text-decoration:none;
    display:table-row!important;
    margin-left: -25px;
    
}
This give me the result at the "padding-margin" figure .  Note that the menu style still the same when changing the "margin-left" value.


and when i just put the upper  code without specifiying the paddin-left parameter at  .RadMenu .rmLink, it give me the result shown at the "margin-left" figure.

I like to have the image inside the menu item borders without any space at the sides.

Thank you for helping,

Sincerly,

Hind
0
Dimitar Terziev
Telerik team
answered on 28 Sep 2011, 03:24 PM
Hi Hind,

Try to provide a live URL in order to examine the behavior on your page.

Kind regards,
Dimitar Terziev
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Tags
Menu
Asked by
Hind
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Hind
Top achievements
Rank 1
Shinu
Top achievements
Rank 2
Dimitar Terziev
Telerik team
Share this question
or