Jagd
Jagd

Reputation: 7306

How to pad an image and text in the asp:Menu control

I have an asp:Menu control that has four different menu items in it. Each menu item has a graphic and a text description.

<Items>
    <asp:MenuItem Text="New Authorization Form" Value="default.aspx" NavigateUrl="~/Default.aspx" ImageUrl="~/Images/TextPad.png"></asp:MenuItem>
    <asp:MenuItem Text="Manage My Forms" Value="myrequests.aspx" NavigateUrl="~/MyRequests.aspx" ImageUrl="~/Images/Pencil.png"></asp:MenuItem>
</Items>

My problem is the icon and text have no padding between them and it just looks ugly! Does anyone know how I can force a bit of padding between the image and text of the menu item? I've looked at all of the attributes on the asp:Menu control, but I haven't been able to find one for this, but I may have just missed it.

Upvotes: 3

Views: 6093

Answers (3)

Nelson
Nelson

Reputation: 1

the image item in the Menu is controlled by the class icon, modifying the properties of this class should solve the problem. I set padding-right to 5px to space image and text

Upvotes: 0

Jagd
Jagd

Reputation: 7306

I came up with an answer, but it's not what I was hoping for exactly. I added a style for img tags to my css like so:

img
{
    padding-right: 5px;
}

I'm still a little bummed that there are no attributes within the asp:Menu control that allow you to specify the padding between the image and menu item text.

Upvotes: 5

Joseph
Joseph

Reputation: 25523

you could try creating a skin and then you could add a css class to and style it any way you want

Upvotes: 0

Related Questions