Solution to inconsistent display of cursor size in input box
|
The cursor size in the input box is inconsistent The difference between IE7 and Chrome is very obvious Let's first look at the cause of the problem: the Chrome browser sets the cursor height in the following principle: when there is no content, the cursor height = the value of the input's line-height; when there is content, the cursor moves from the top of the input to the bottom of the text. OK, now that we know the reason, we will take some corresponding measures. Tried two ways to do it:. Method 1: Set the line-height value to the same as the font size; if the height is not reached, use padding to support it; Method 2: Do not set line-height for Chrome, it will automatically center the text, and set the line-height value for IE to ensure that the text is vertically centered. Please note here that if line-height and other values are set in the reset style file, please reset line-height, you can use line-height:normal. For details, please look at the search box on the Tencent Hollywood page. Specific css: Copy code The code is as follows:height: 34px; font-size: 12px; line-height: normal; line-height: 34px\9; |
<<: A brief analysis of CSS3 using text-overflow to solve text layout problems
>>: Learn more about the most commonly used JavaScript events
Recommend
jQuery implements clicking left and right buttons to switch pictures
This article example shares the specific code of ...
How to run py files directly in linux
1. First create the file (cd to the directory whe...
Detailed explanation of two ways of Linux service management: service and systemctl
1.service command The service command actually go...
What to do if you forget your Linux/Mac MySQL password
What to do if you forget your Linux/Mac MySQL pas...
HTML thead tag definition and usage detailed introduction
Copy code The code is as follows: <thead> &...
Interpreting MySQL client and server protocols
Table of contents MySQL Client/Server Protocol If...
MySql 8.0.11-Winxp64 (free installation version) configuration tutorial
1. Unzip the zip package to the installation dire...
How to install MySQL database on Ubuntu
Ubuntu is a free and open source desktop PC opera...
Detailed explanation of the properties and functions of Vuex
Table of contents What is Vuex? Five properties o...
Various ways to modify the background image color using CSS3
CSS3 can change the color of pictures. From now o...
mysql trigger creation and usage examples
Table of contents What is a trigger Create a trig...
Install docker offline by downloading rpm and related dependencies using yum
You can use yum to install all dependencies toget...
MySQL transaction, isolation level and lock usage example analysis
This article uses examples to describe MySQL tran...
Complete steps to use element in vue3.0
Preface: Use the element framework in vue3.0, bec...
40 fonts recommended for famous website logos
Do you know what fonts are used in the logo desig...