css - Bootstrap table no new line

Question

<h3>Mijn biedingen</h3>
        <table class="table table-responsive">
        <thead>
        <tr>
            <th>nummerplaat</th>
            <th>Bod</th>
            <th>Status</th>
            <th>Datum bod</th>
            <th>Aankoopdatum</th>
        </tr>
        </thead>
        <tbody>
                    <tr>
            <td>THOMAS</td>
            <td>&euro;    90 000,00</td>
            <td>open</td>
            <td>15/10/2014</td>
            <td>
                                        Niet beschikbaar
                                </td>
        </tr>
                    </tbody>
    </table>

This is my code, this is the result: https://www.dropbox.com/s/6vkc2mpu7z4yqgq/Screenshot%202014-10-15%2019.28.09.png?dl=0

How can I have the money TD on one line? This website is responsive but the the text becomes in two lines because of the spaces in the text.

question from:https://stackoverflow.com/questions/26388593/bootstrap-table-no-new-line

Answer 1

If you want to have the text in same line use CSS style

white-space:nowrap;

eg:

<span class="nowrap">Your text here</span>

In CSS style sheet

 .nowrap {
        white-space:nowrap;
    }

Bootstrap way of doing it

Since you already have bootstrap, no need of class definition, you can use class text-nowrap

Just try this in your td or if doesn't work try adding a span around your text and assign the class

eg:

<td class="text-nowrap"> Your text </td>

or

<td> <span class="text-nowrap">Your text </span></td>

You can also have it in the table tag, so that no need to add in each element

eg: <table class="text-nowrap"> .... </table>

More on this in Bootstrap documentation Check under Alignment classes

Bootstrap 4 documentation here

Bootstrap 5 documentation here