63

I'm using a barcode font "Free 3 of 9 Extended Regular" and the print out needs to have multiple spaces in some cases, to match the number of characters in the field. Example:

*AA-XXXX    *"

(four spaces follow the item number to make the 12 characters. The barcode reader will give me an error if there are less characters.

nbsp; will force multiple spaces, however, IE and Firefox both display those as standard font spaces and do not use the barcode font. The barcode displays as broken up between the non-space characters. (Incidentally, only IE 6 does display nbsp; in the proper font.) If I use a regular space, it trims the number of spaces down and displays only one.

starball
  • 20,030
  • 7
  • 43
  • 238
Ted Scheckler
  • 1,389
  • 4
  • 16
  • 34

5 Answers5

134

Look at the white-space css property

Using

.barcode{
    white-space:pre; /* or pre-wrap if you want wrapping to still work. */
}

and

<span class="barcode">*AA-XXXX    *"</span>

will do the trick.

.barcode{
    font-family:Courier;
    white-space:pre; /* or pre-wrap if you want wrapping to still work.*/
}
<span class="barcode">*AA-XXXX    *"</span>

external demo: http://www.jsfiddle.net/gaby/Z3gkq/

Gabriele Petrioli
  • 191,379
  • 34
  • 261
  • 317
  • 3
    If you come here from google just looking to preserve whitespace, use pre-wrap, not pre, unless you want the text to never break to a new line... http://www.w3schools.com/cssref/pr_text_white-space.asp – Stefan Steiger Jun 18 '16 at 08:47
  • @StefanSteiger yes, i mention that in the CSS comment in my code – Gabriele Petrioli Jun 18 '16 at 17:35
30

Use <pre> when whitespace is significant.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
14

you can replace all spaces with &#160

Mahmoud Farahat
  • 5,364
  • 4
  • 43
  • 59
-1

I like to use this special white-space that HTML and JavaScript does not detect as white-space. ->" "

It looks better on the code end too.

UPDATE

Looks like stack over flow replaces it with a regular space so here is the ASCII code for it

Dec 160 Hex A0 Oct 240

Parley Hammon
  • 27
  • 1
  • 3
  • I checked your char ASCII code in "" and it's 32 which is just a regular space.. Did you paste it in wrong? – njminchin Jul 03 '17 at 07:36
  • 1
    That's odd, no wonder I got the down vote. I wonder if it was replaced. It's suppose to be Dec 160 - Hex A0 - Oct 240. – Parley Hammon Jul 13 '17 at 23:42
-1

Using &nbsp for spaces is a complete misuse of it.

You can use span tag -

<span style="margin-left: 10px; margin-right: 10px">*AA-XXXX    *"</span>
Ninad Kulkarni
  • 61
  • 1
  • 11