TEXT Inside a button - Materialize CSS

Asked

Viewed 661 times

2

I’m having a hard time breaking text inside a button. I make use of materialize css but in general I have no idea how to put all the text I want inside a button, it always cuts the end of my titles and etc.

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/css/materialize.min.css">


<c:when test="${p.parCodigoReg!=0}">
	<a href="impressaoBoleto.do?     codigoPar=${p.parCodigoReg}&parTipo=N&rel=boleto&portal=1" 
            target="blank" 
            class="waves-effect waves-light btn-large z-depth-4">
  <i class="large material-icons left">cloud</i>
    Imprimir Boleto de Mensalidade ParcelasRegulares   
  </a>
  <span>
    Próximo Vencimento: ${p.parVencimento}
  </span>
</c:when>

css button materialize

2 answers

1

So that all the text fits within your button you need to change the height for auto, thus:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/css/materialize.min.css">

<style>

#botao {
    height: auto !important;
}

</style>


<c:when test="${p.parCodigoReg!=0}">
    <a href="impressaoBoleto.do?     codigoPar=${p.parCodigoReg}&parTipo=N&rel=boleto&portal=1" 
            target="blank" 
            class="waves-effect waves-light btn-large z-depth-4" id="botao">
  <i class="large material-icons left">cloud</i>
    Imprimir Boleto de Mensalidade ParcelasRegulares   
  </a>
  <span>
    Próximo Vencimento: ${p.parVencimento}
  </span>
</c:when>

0

@Jonatas Almeida put the code to analyze.
You need to enter the Materialize classes to work. It would look something like this: 

        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/css/materialize.min.css">
        <a class="waves-effect waves-light btn">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper ex id hendrerit.</a>

Browser other questions tagged css button materialize

You are not signed in. Login or sign up in order to post.