Почему какой-то текст исчезает (не отображается) при тестировании на мобильном устройстве?

-4

Почему какой-то текст исчезает (не отображается) при тестировании на мобильном устройстве?Почему какой-то текст исчезает (не отображается) при тестировании на мобильном устройстве?

Я хочу показать весь текст при тестировании на мобильном устройстве. по полноразмерному тексту, как я могу это сделать?

<html> 
<head> 
    <meta content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1" name="viewport"> 
</head> 
<body style=" margin: 0; "> 
<div style=" 
    width: 100%; 
    height: 48px; 
    text-align: center; 
    overflow: hidden; 
    display: block; 
    position: absolute; 
    background: #a5d670; 
    z-index: 999; 
    color: #fff; 
    font-size: 20px; 
    line-height: 48px; 
">After clicking the submit button, FormValidation will submit the form if all the fields are valid. 
</div> 
</body> 
</html>

источник

2016-10-18 mamamama mongmongmongmong

Попробуйте удалить абсолютное положение и установить автоматическую высоту –

Вы установка height свойство 48px. На узком экране текст должен быть обернут, чтобы его можно было показать. Однако с этой небольшой высотой он не появится.

Вместо этого я предлагаю вам использовать min-height.

источник

2016-10-18 16:45:00 demarchisd

Когда вы устанавливаете overflow: hidden;, а ширина окна просмотра слишком тонкая, часть текста, которая не соответствует ширине, исчезнет.

Удаление, что сделает текст перерыв в несколько строк, но, как вы определили height: 48px; текст будет вынесено из зеленого фона, для того, чтобы оставшийся текст появится, вы должны сделать:

<div style=" 
    width: 100%; 
    text-align: center; 
    display: block; 
    position: absolute; 
    background: #a5d670; 
    z-index: 999; 
    color: #fff; 
    font-size: 20px; 
    line-height: 48px; 
">After clicking the submit button, FormValidation will submit the form if all the fields are valid. 
</div>

Проверьте this fiddle на результат

источник

2016-10-18 16:45:11

Почему какой-то текст исчезает (не отображается) при тестировании на мобильном устройстве?

ответ

Смежные вопросы