문제 CSS 글꼴 크기 반응

Question

웹 페이지 HTML을 개발했습니다. Google 크롬 모바일 에뮬레이터를 사용하여 모바일에서 내 요소의 동작을보고 싶었습니다.

그리고 이상한 것들을 발견했습니다.

<div> 
    <div> 
     <span>config.alarm_vocal_lines_config[1].line_id</span> 
     <span>1 </span> 
    </div> 
    <div> 
     <span>config.alarm_vocal_lines_config[1].audio_level_line_config</span> 
     <div> 
    <span>config.alarm_vocal_lines_config[1].audio_level_line_config.main</span> 
      <input type="number" value="-90"> 
     </div> 
    </div> 
    <br> 
</div> 

<div> 
    <div> 
     <span>config.alarm_vocal_lines_config[2].line_id</span> 
     <span>2 </span> 
    </div> 
    <div> 
     <span>config.alarm_vocal_lines_config[2].audio_level_line_config</span> 
    </div> 
    <br> 
</div> 

<div > 
    <div > 
    <span>config.alarm_vocal_lines_config[3].line</span> 
    </div> 
    <br> 
</div> 

첫 번째 문제 :이 코드, 에뮬레이터에서, 세 번째 줄은 다른 후 작은

나는이 코드를 가지고있다.

왜? 그것을 피하는 방법? 내가 마지막 줄에서 하나 개의 문자를 제거하면

두 번째 문제, 모든 라인이 작아 : 스타일 변화와 어떻게 그것을 피할 이유

이

누군가가 말해 줄래?

자신을 분명히했는지 확실하지 않습니다. 추가 설명을 요청하십시오.

내가 가진되지 않은 CSS

당신은 당신의 텍스트 행 높이를 추가 할 필요가

Answer 1

.

span { 
 
    line-height: normal; 
 
    font-size: 16px; 
 
}

Answer 2

만약 그 당신이 (당신이 하나를 가지고하지 않은 경우, 하나를 만들거나) 당신은

span { 

    font-size: 16px !important; 

} 

CSS 파일에이 붙여 넣기 시도 할 수, 걱정 글꼴 크기