I forum Ricerca FAQ
Fai una domanda
Ultimo messaggio
sabby88
sabby88
il 20 maggio 2014 alle 12:51
10 messaggi dal 19 giugno 2013
Ciao a tutti,
ho un problemino: devo usare un <asp:Button> e mettegli un immagine che vada alla fine del testo del bottone stesso. sto facendo tutto tramite css solo che, essendo il testo dinamico, che cambia a seconda di diverse condizioni, non posso sapere a priori la lunghezza del testo e definire di conseguenza il width da dare per far si che l'immagine non si trovi sotto al testo ma accanto, alla fine. Ho letto in giro che potrei usare i pseudo selettori :before o :after, ma ho letto e provato che per i button non funzionano. Come posso fare? se vi puo' far comodo vi posto la parte css che ho scritto fin ora 
 input.btnDoc
{
  background-image: url("../img/docview.png");
  background-position: right;
  background-repeat: no-repeat;
  border-style: none;
  height: 2em;
  width: auto;
  text-align: left;
  text-decoration: underline;
  margin-top: 0.2em;
}

grazie in anticipo!
RispondiQuoting
BrightSoul
BrightSoul
il 20 maggio 2014 alle 20:04
11.886 messaggi dal 09 febbraio 2002
Contributi
Ciao,
non è necessario calcolare la lunghezza del testo; basta aggiungere qualche pixel di padding-right in modo che si crei una spaziatura tra il testo e il bordo del bottone. In quello spazio visualizzerai un'immagine di sfondo, grazie a background-position:right.

Ecco un esempio:
http://jsfiddle.net/2Th4b/1/

sabby88 ha scritto:

i pseudo selettori :before o :after, ma ho letto e provato che per i button non funzionano

Già, perché gli asp:Button di ASP.NET vengono renderizzati come degli <input type="button" e il tag <input> non è un contenitore. Di conseguenza, non può ospitare il content che hai definito per :before e :after.

Se al posto di un asp:Button usassi un <button runat="server"></button> potresti avvalerti di :before e :after perché <button> invece è un tag contenitore. La soluzione che ti ho indicato prima andrà benissimo ma, se scegli per questa strada, qui troverai del codice di esempio:
http://stackoverflow.com/questions/187482/how-can-i-use-the-button-tag-with-asp-net

ciao,
Moreno
Enjoy learning and just keep making
RispondiQuoting
sabby88
sabby88
il 23 maggio 2014 alle 11:05
10 messaggi dal 19 giugno 2013
Ciao Moreno,
grazie per la risposta! infatti con un padding-right ho risolto!a volte ti scappano le soluzioni più semplici!
Grazie ancora
Saby
RispondiQuoting

Torna al forum | Feed RSS

ASPItalia.com non è responsabile per il contenuto dei messaggi presenti su questo servizio, non avendo nessun controllo sui messaggi postati nei propri forum, che rappresentano l'espressione del pensiero degli autori.