Loading...
Обучение/Помощь новичкам | Помогите с отображением
Вообщем есть страница авторизации на сайте, она содержит форму.
Так вот, нет никаких стилей на странице и тд, в которых бы была форма.
При посещении страницы с компа все отображается норм, форма по центру экрана, но если зайти с телефона то видно только половину формы, вся не вмещается. Помогите или подскажите как сделать, чтобы форма была адаптивной и там и там?
[xrystalll] , http://gm.instaprem.ru
style

input {
font-family: 'Lucida Grande', Tahoma, Verdana, sans-serif;
font-size: 14px;
}

input[type=text], input[type=password] {
margin: 5px;
padding: 0 10px;
width: 200px;
height: 34px;
color: #404040;
background: white;
border: 1px solid;
border-color: #c4c4c4 #d1d1d1 #d4d4d4;
border-radius: 2px;
outline: 5px solid #eff4f7;
-moz-outline-radius: 3px;
-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.12);
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.12);
}
input[type=text]:focus, input[type=password]:focus {
border-color: #7dc9e2;
outline-color: #dceefc;
outline-offset: 0;
}

input[type=submit] {
padding: 0 18px;
height: 29px;
font-size: 12px;
font-weight: bold;
color: #527881;
text-shadow: 0 1px #e3f1f1;
background: #cde5ef;
border: 1px solid;
border-color: #b4ccce #b3c0c8 #9eb9c2;
border-radius: 16px;
outline: 0;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
background-image: -webkit-linear-gradient(top, #edf5f8, #cde5ef);
background-image: -moz-linear-gradient(top, #edf5f8, #cde5ef);
background-image: -o-linear-gradient(top, #edf5f8, #cde5ef);
background-image: linear-gradient(to bottom, #edf5f8, #cde5ef);
-webkit-box-shadow: inset 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.15);
box-shadow: inset 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.15);
}
input[type=submit]:active {
background: #cde5ef;
border-color: #9eb9c2 #b3c0c8 #b4ccce;
-webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.2);
}

.lt-ie9 input[type=text], .lt-ie9 input[type=password] {
line-height: 34px;
}

________
посл. ред. 29.10.2018 в 18:30; всего 2 раз(а); by heroin

<link rel="stylesheet" href="/путь к файлу стилей">
PhpStorm , я имел ввиду что сторонние стили не имеющие отношения к форме не участвуют в форме. Только тег <form>

(стиль формы подключен)
[xrystalll] , пост 6
Обьясните почему форма так отображаеться и как это исправить?
Ты абсолютно задаешь ширину контрола. Это не правильно.
Используй Padding и width: 100%.
Онлайн: 5
Время:
Gen. 0.1053
(c) Bym.Guru 2010-2026