problem description
when you do webapp development, there is no problem with the online page, but in the step-by-step learning machine S2, app opens the page inside, and div sets the width and height. If there is no text and line-height in it, div will not be opened. In addition, you can use display:-webkit-box;. However, if you want to make a picture width larger than the screen, no matter how wide the img is set, it can only be displayed as the screen width, and there is no problem with other tablets, so there is a page compatibility problem
.the environmental background of the problems and what methods you have tried
- I wrote a test div click to show that the width and height of the screen and the width and height of the user-agent; are 1536mm 2048; but document.documentElement.clientWidth is 1241; the calculated rem is incorrect; the user-agent obtained is Android5.0.2;AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Safari/534.30;
- div"s original background is not displayed. Later, if it can be changed to img, it can be changed to img,. If it cannot be changed to img, add text to div and change it to color: transparent; line-height: to div height.
- vue introduces a single page written without scaffolding
related codes
/ / Please paste the code text below (do not replace the code with pictures)
/** css **/
.course_small_container {
width: 13rem;
height: auto;
overflow-y: hidden;
overflow-x: auto;
padding-top: 0.2rem;
font-size: 0;
display: block;
}
.course_small_container img {
height: 1.654rem;
width: auto;
margin-top: 0.2rem;
}what result do you expect? What is the error message actually seen?
- someone who is familiar with the webview kernel can tell the kernel which CSS? can be used. Or the version of css;
- the kernel found seems to correspond to Android 4.2. I wonder if it is correct?
- how to achieve compatibility with the img above, and the scrolling function can be achieved on this pad;