Automatic Text Break

Asked

Viewed 391 times

0

I’m trying to remove the Line Break from this table, but I don’t know how to effect it, I wanted to let the full name be written and without the line break.

inserir a descrição da imagem aqui

Code:

    #customers {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}
#customers2 {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

#customers td, #customers th {
    border: 1px solid #ddd;
    padding: 8px;
}

#customers2 td, #customers2 th {
    border: 1px solid #ddd;
    padding: 8px;
}

#customers th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #3e4e84;
    color: white;
}

#customers2 th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: black;
    color: white;
}

Index:

<table id="customers">
    <thead>
        <tr>
            <th>Nome</th>
            <th>RG</th>
            <th>Data Entrada</th>
            <th>Data Saida</th>
            <th>Departamento</th>
            <th>Responsável</th>
            <th>Atualizar Saída</th>

        </tr>
    </thead>
    <tbody>



        @foreach (var v in Model)
        {
            <tr>

                <td>@v.Nome</td>
                <td>@v.Rg</td>
                <td>@v.DtIntegracao</td>
                <td>@v.Validade</td>
                <td>@v.Departamento</td>
                <td>@v.Responsavel.Nome</td>

                <td>@Html.ActionLink("Atualizar", "FormUpdate", new { id = v.Id }, new { @class = "icon-edit" })</td>


            </tr>

        }

    </tbody>
</table>
  • 1

    William, don’t you have a line breaking character there? The text shouldn’t break like this, because it has a size td. See also the attribute padding of td

  • Go to inspect the element and see what is happening within the line with the text. See if there is too much padding on it, if the margin of the text is wrong... What you can see on inspect?

  • in last case puts in td this css white-space: nowrap;

  • I don’t know much about css, what I’m wondering is breaking the text by myself.

  • @I tried to change padding continues to cut the text yet.

  • Create a functional example with the code that matches the image so we can analyze better, only with this piece of code is difficult

  • @Ricardopunctual Editing with all my CSS has already been done, to facilitate understanding

  • But William, it’s still not a verifiable example, you know? You can’t run it and see the result, see this other question for example, where you can replicate and check the problem: https://answall.com/q/319656/57220

  • @Ricardopunctual don’t quite know how to effect what I want, but what I wanted was instead to do the Text Break

  • Guy with this CSS that you put in the question and with this HTML the table doesn’t even come close to being like in the image you posted, so it is impossible to simulate your error to help you...

  • @hugocsl I think now should be clearer my doubt.

Show 6 more comments
No answers

Browser other questions tagged

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