Share a method to make the font size larger and not centered in the preface

Scenario: Click on a letter to pop up a modal, and display the letter in the modal.
style:

.modal{
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: 600rpx 300rpx 0 300rpx;
  height: 140rpx;
  border-radius: 10rpx;
  line-height: 160rpx;
  color: #fff;
  font-size: 40pt;
  box-sizing: border-box;
  background-color: rgba(178, 178, 178, 0.7)
}

The results are as follows:

##1.png

Analysis: By zooming in and out of the font, you can see that the font is centered when it is small, and when it is zoomed in, it is zoomed in along the left line, which is different from the mechanism center point zoom in CSS.

Solution: add padding

padding-right: 23rpx;The result is as follows:

2.png

The above is the detailed content of Share a method to make the font size larger and not centered in the preface. For more information, please follow other related articles on the PHP Chinese website!