dcsimg
www.webdeveloper.com
Results 1 to 5 of 5

Thread: How To Justify Table Cell With Non-Breaking Space?

  1. #1
    Join Date
    May 2005
    Posts
    5

    How To Justify Table Cell With Non-Breaking Space?

    I'm trying to get the table cell

    <td style="text-align: justify;">L&nbsp;pigeons 000</td>

    to display with the text "L Pigeons" on the left and the text "000" on the right. Both Firefox and Chrome treat the &nbsp; as a normal space and split it up as in

    "L....Pigeons....000"

    where "." represents a space.

    If I change the "&nbsp;" to a "-" it works as expected:

    "L-Pigeons.......000"

    which I take to mean that the "justify" attribute is working.

    I also tried replacing "L Pigeons" with <span style="white-space: nowrap;">L Pigeons</span> to no effect.

    Is there some other way to code the concept of a non-breaking space so that "justify" doesn't ignore it?
    What am I missing?

  2. #2
    Join Date
    May 2017
    Posts
    3
    Can you post full your table code, please?

  3. #3
    Join Date
    May 2017
    Posts
    3
    A ha , you can use [white-space] of CSS {white-space: nowrap;}.
    Source: http://toolwebmega.net/css-css3/white-space.html

  4. #4
    Join Date
    Dec 2012
    Posts
    1,542
    I also tried replacing "L Pigeons" with <span style="white-space: nowrap;">L Pigeons</span> to no effect.
    this works when you apply display:inline-block to the span:
    https://jsfiddle.net/f5j5e7et/2/
    nowrap affects wrapping, i. e. automatic inserting of line breaks, not inserting empty spaces when justifying.

  5. #5
    Join Date
    Mar 2012
    Posts
    3,961
    I suspect that you may be asking the wrong question. Perhaps the apposite question is why you have two separate pieces of text in the same table cell? Or, should you be using a table at all?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center