okjfokjrf
okjfokjrf

Reputation: 135

How can i fit my text with the size of the input?

<div class="mdl-row">
            <div class="mdl-cell mdl-cell--4-col mdl-dynamic">
                <div class="mdl-textfield mdl-textfield--floating-label">
                    <form:label path="denominacionComercialTicket"
                        cssClass="mdl-textfield__label">
                        <spring:message
                            code="contrato.denominacion.comercial.ticket.compra" />
                    </form:label>
                    <form:input path="denominacionComercialTicket"
                        cssClass="mdl-textfield__input" maxlength="22" required="required"  data-parsley-pattern="/[A-Za-zÀ-ÿ\u00f1\u00d10-9]+/"
                                data-parsley-pattern-message="La denominación comercial debe contener, por lo menos, una letra o un número"/>
                    <p id="prueba" style="color:red;">La denominación comercial debe contener 22 caracteres como máximo</p>         
                </div>
                <form:errors cssClass="help-block"
                    path="denominacionComercialTicket"></form:errors>
            </div>

The question here is how can i fit my text "La denominación comercial debe contener 22 carácteres como máximo" which is a p label with the size of my input

enter image description here

Upvotes: 0

Views: 28

Answers (1)

Nitheesh
Nitheesh

Reputation: 19986

Try using word-break: break-all;

.container {
  word-break: break-all;
  width: 300px;
  padding: 5px;
  border: 1px solid green;
}
<div class="container">
  Honorificabilitudinitatibus califragilisticexpialidocious
  Taumatawhakatangihangakoauauotamateaturipukakapikimaungahoronukupokaiwhenuakitanatahu
  次の単語グレートブリテンおよび北アイルランド連合王国で本当に大きな言葉
</div>

Upvotes: 1

Related Questions