центрированная CSS текстовая область с ограничением символов
Я новичок в stackoverflow, а также в веб-разработке. Я считаю, что первая часть того, что я пытаюсь сделать, должна быть легкой, но у меня есть довольно много проблем, чтобы понять это.
Первый стиль, очевидно, центрирует мое фоновое изображение, и это, кажется, работает нормально. Что я хотел бы сделать дальше, так это добавить 3 элемента на страницу. 1. График, 2. Текстовая область фиксированного размера, которая ограничивает количество введенных символов до 300 символов и 3. Кнопка submit.Я бы хотел ... все эти элементы должны быть центрированы. Текстовая область должна быть непосредственно центрирована, графика должна быть выровнена по левому краю текстовой области и 10 пикселей над ней, кнопка отправки должна быть выровнена по правому краю и 10 пикселей под ней.
Вот что у меня есть:
html {
background: url(field1.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#box {
position: absolute;
background-image:url(textarea.png);
height: 250px;
width: 550px;
border-radius: 5px;
margin: -125px 0 0 -275px;
top: 50%;
left: 50%;
}
#button {
position: absolute;
background-image:url(button.png);
height: 55px;
width: 151px;
top: 260px;
left: 399px;
border-radius: 5px;
}
#graphic {
position: absolute;
background-image:url(graphic.png);
height: 58px;
width: 184px;
top: -328px;
left: -399px;
}
<div id="box"></div>
<div id="button"></div>
<div id="graphic"></div>
У меня есть 3 дива, по одному для каждого элемента в моем HTML, и мне интересно, как добавить textarea так, чтобы это был просто курсор в центре поля, который ограничивает до 300 персонажи.
На данный момент я просто хотел бы, чтобы все было выстроено должным образом с textarea работает. Затем я буду работать над отправкой текста из коробки, хранением его и использованием его для выполнения множества вещей. Любая помощь будет очень признательна. Спасибо.
1 ответ:
Вот так? http://jsfiddle.net/zFcHp/3/ - я ограничил его до 10, а не 300, потому что 300 действительно раздражает тест :). Просто измените атрибут maxlength.
Также имейте в виду, что вам все еще нужно проверить длину строки, возвращающейся от клиента, так как любой человек с firebug или любым из сотни других инструментов может снять ваше ограничение на стороне клиента и отправить вам все, что угодно. Они даже могут скачать код для Firefox и изменить его, чтобы нарушить любой веб-сайт. стандарты правят, они хотят затем перекомпилировать... Никогда не доверяйте клиенту навязывать что-либо!