The space is displayed differently in IE, Firefox, and Chrome browsers

  The display effects on IE, Firefox, and Chrome browsers are slightly different, mainly because the width of the preceding space is different.

Online information says that different browsers have different default fonts. Generally, the default font of IE is Songti, while the default font of Firefox and Chrome is Times New Roman.
Songti is a font with monospaced characters, but Times New Roman is not a font with monospaced characters, because the default fonts of browsers are different.
The display width of the space character   varies in different browsers.

For example, the following code is tested with IE and Chrome respectively

Copy code

The code is as follows:

<table>
<tr>
<td>I am the first row</td>
</tr>
<tr>
<td>nbsp;nbsp;nbsp;nbsp;I am the second row</td>
</tr>
<tr>
<td>nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;I am the third row</td>
</tr>
</table>

The display effect in Chrome is as follows:

The display effect under IE9 is as follows:

It can be seen that two   occupy the width of one Chinese character in Chrome, while four   occupy the width of one Chinese character in IE.
Solution:
1. Modify the encoding format of the page <meta http-equiv="content-type" content="text/html; charset=gbk">
And how to compile the page (in myeclipse)

Then right-click IE to modify the encoding display format

2. (Recommended) Set the font on the line with spaces. Just set the font to any font with equal spacing between characters.
like:

Copy code

The code is as follows:

<div style="font-family: '宋体'">nbsp;nbsp;nbsp;nbsp;I am the second row</div>

PS:nbsp;Replace with 

<<: Based on JavaScript ES new features let and const keywords

>>: Implementing custom radio and check box functions with pure CSS

The space is displayed differently in IE, Firefox, and Chrome browsers

How to create Baidu dead link file

MySQL big data query optimization experience sharing (recommended)

MySQL quick recovery solution based on time point

Detailed explanation of several error handling when Nginx fails to start

JavaScript function detailed introduction

Detailed explanation of CSS counter related attributes learning

Implementation of webpack code fragmentation

Markodwn's detailed explanation of the idea of synchronous scrolling with title alignment

Tutorial on installing mysql5.7.17 via yum on redhat7

Summary of MySQL InnoDB locks

Recommend

React sample code to implement login form

Interpretation of the module for load balancing using nginx

Things to note when migrating MySQL to 8.0 (summary)

A simple way to achieve scrolling effect with HTML tag marquee (must read)

Summary of uncommon js operation operators

How to wrap HTML title attribute

Tutorial on installing and using virtualenv in Deepin

Tutorial on installing and configuring Tomcat on Alibaba Cloud Server and adding external network access ports

Sample code for implementing mobile expansion and collapse effects with pure CSS3

How to represent various MOUSE shapes

The difference and usage between div and span

An article to understand MySQL master-slave replication and read-write separation

Play mp3 or flash player code on the web page

Solution to the problem that mysql local login cannot use port number to log in

Detailed steps for installing and configuring MySQL 5.7