Some problems in css

1. Each inline element will have a strut (pillar)

For example, the following img

<div class="parent">
  <img class="child" src="./assets/logo.png">
</div>

.parent{
  background:gray;
}
.child{
  line-height: 0;
  border: 1px solid red;
}

You can see that the place circled in yellow is a few more pixels in height, which is caused by the blank nodes that will exist in inline elements

Blank nodes can be removed by the following methods

1) Set attributes on the parent element: font-size:0 (hidden text) or line-height:0 (remove the line height)

2) Set the attribute on the child element: display: block or set vertical-align: to any value other than the default value, such as top (set the baseline to the top alignment)

 

2. The problem of the input box under ios: When the input box is focused, the cursor is not displayed, and every time a character is input, you need to focus manually.
Solution: Add attributes to the input box: -webkit-user-select: text !important ;

3. The fixed positioning does not take effect. It may be that the parent element has a transform set. Refer to the article: https://www.zhangxinxu.com/wordpress/2015/05/css3-transform-affect/ , https://www.cnblogs. com/mufc/p/12029393.html