2013-11-26 3 views
1

Я пытаюсь сгенерировать поле ввода даты с шириной 150 пикселей (у меня есть желаемое поведение линии в зависимости от ширины экрана).Ввод даты отображается неправильно при установке ширины

И он прекрасно работает на Mac/Chrome (см jsFiddle), но когда я исполню ее на Android, это выглядит следующим образом:

Screenshot from Android

Он находится в середине, потому что текст выравнивать установлен вправо. 150px будет о том, где заканчивается 1983.

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

PS: Он также работает на Mac/Firefox и Mac/Safari

ответ

0

Ваш запрос СМИ делает поле даты имеют ширину на 100%. Если вы хотите, чтобы это изменилось, измените ширину в запросе на медиа.

@media all and (max-width: 410px) { 
    .dispInline { 
     text-align: left; 
     width:100%; 
    }  
    .dispInlineDate { 
     width: 150px;   
    } 
} 
+0

Он меняет ширину div, который содержит поле ввода даты – Daniel

+0

Я не хочу, чтобы текст выравнивался влево. Я хочу, чтобы он отображался с шириной 150 пикселей на Android, как и на Mac/Chrome. – Daniel

+0

Если бы я хотел, чтобы он был выровнен слева, было бы легче удалить «text-align: right» из его стиля – Daniel

0

Я поставил на .css:

.dispInlineDate { 
    float:none;  
} 

и удалены width:150px; от встроенного стиля. Установка этого параметра прерывает текстовое положение.

Теперь это работает. Кроме того, можно установить другой div с 150px, тогда он будет ровно 150px.

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