[CLOSED] Custom Image in Button

2 Attachment(s)

The Code:

Code:

<%@ Page Language="vb" %> <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:Button runat="server" Height="80" Width="60" IconAlign="Top" TextAlign="Center" Text="Simple<br>test" Scale="Large" IconUrl="Image48x48.png" Margin="50" EnableToggle="true" Flat="true"/> </form> </body> </html>

Show a Button with image truncate vertically !
It's possible show a full image with text multiline on bottom?

Attachment 23980

Attachment 23981

Hi Mario,

This might help:
http://forums.ext.net/showthread.php?19517

1 Attachment(s)

Hi Danill,

I have yet tried the solution in your thread, but it not work for me !

The code:

Code:

<%@ Page Language="vb" %> <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Ext.NET v2 Example</title> <style type="text/css"> .my-scale.x-btn-default-large-icon button, .my-scale.x-btn-default-large-icon a, .my-scale.x-btn-default-large-icon .x-btn-inner { height: 48px !important; line-height: 48px; } .my-scale.x-btn-default-large-icon .x-btn-inner { width: 48px; } .my-scale.x-btn-default-large-icon .x-btn-icon { width: 48px; height: 48px; } .my-scale.x-btn-default-large-icon-text-left button, .my-scale.x-btn-default-large-icon-text-left a { height: 48px; } .my-scale.x-btn-default-large-icon-text-left .x-btn-inner { height: 48px; line-height: 48px; padding-left: 52px; } .my-scale.x-btn-default-large-icon-text-left .x-btn-icon { width: 48px; } .x-ie6 .my-scale.x-btn-default-large-icon-text-left .x-btn-icon, .x-quirks .my-scale.x-btn-default-large-icon-text-left .x-btn-icon { height: 48px; } </style> </head> <body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:Button runat="server" Text="Text" Scale="Large" Cls="my-scale" IconUrl="image48x48.png" /> </form> </body> </html>

The result:
Attachment 23985

The icon button is always 32 x 32 !
Solutions?

Please try this example:

Example

Code:

<%@ Page Language="C#" %> <!DOCTYPE html> <html> <head runat="server"> <title>Ext.NET v2 Example</title> <style> .my-scale .x-btn-button { height: 48px; } .my-scale .x-btn-inner { line-height: 48px; padding-left: 52px; } .my-scale .x-btn-icon-el { background-size: 48px; width: 48px; } </style> </head> <body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:Button runat="server" Text="Button" Cls="my-scale" IconUrl="icon.png" /> </form> </body> </html>

Tnx Danill,

I have change your example... and It work for me.

Mario

Code:

<%@ Page Language="C#" %> <!DOCTYPE html> <html> <head runat="server"> <title>Ext.NET v2 Example</title> <style> .my-scale .x-btn-inner { line-height: 48px; padding-top: 48px; } .my-scale .x-btn-icon-el { background-size: 48px; height:48px; } </style> </head> <body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:Button runat="server" Text="Pippo" Width="60" Height="80" IconAlign="Top" TextAlign="Center" Cls="my-scale" IconUrl="Image48x48.png" /> </form> </body> </html>