Как выровнять поля почтовой формы и несколько полей select?

голоса: 0

Здравствуйте.

Создал почтовую форму которая открывается во всплывающем окне.

Что надо сделать чтобы задвинуть поля указанные на скриншоте вправо, красные звездочки обязательных полей завести внуть поля после Имя и E-mail, чтобы форма стала более квадратной.

И второй вопрос. Как можно сделать ширину полей select одинаковой ширины? Они меняются взависимости от текста внутри них. Можно ли сделать эту ширину фиксированной?

Спасибо

Адрес сайта http://uchichina.ucoz.net
| Автор: | Категория: Дизайн сайта

Ответов: 1

голоса: 0
 
Лучший ответ

Попробуйте в стили прописать:

#table1 font {
    position: relative;
    left: 155.5px;
    top: 4px;
}
#table1 select {
    width: 95%;
}

| Автор:
Выбор ответа лучшим | | Автор: Garri Gray

Добавляю в конец стилей CSS.  Изменений нету.

​Так выглядит шаблон почтовой формы

<table border="0" width="100%" id="table1" cellspacing="1" cellpadding="2">
<tr><td width="35%"><font color="red">*</font></td><td><input type="text" name="f2" size="30" style="width:95%;" maxlength="70"placeholder="Имя"> </td></tr>
<tr><td><font color="red">*</font></td><td><input type="text" name="f1" size="30" style="width:95%;" maxlength="70"placeholder="E-mail"> </td></tr>
<tr><td></td><td><input type="text" name="f7" size="30" style="width:95%;" maxlength="70"placeholder="Телефон"> </td></tr>
<tr><td></td><td><textarea rows="7" name="f3" cols="30" style="width:95%;"placeholder="Текст сообщения"></textarea> </td></tr>
<tr><td></td><td><select name="f4"><option>Где Вы сейчас учитесь?</option> <option>8 класс</option> <option>9 класс</option> <option>10 класс</option> <option>Колледж</option> <option>1 курс бакалавриата</option> <option>Последний курс бакалавриата</option> <option>1 курс магистратуры</option> <option>Последний курс магистратуры</option> <option>Закончил обучение</option></select></td></tr>
<tr><td></td><td><select name="f5"><option>Выбрать программу обучения</option> <option>Языковой курс</option> <option>Коллдеж</option> <option>Бакалавриат</option> <option>Магистратура</option></select></td></tr>
<tr><td></td><td><select name="f6"><option>Наличие загранпаспорта?</option> <option>Есть загранпаспорт</option> <option>Нет загранпаспорта</option></select></td></tr>
<tr><td colspan="2" align="center"><br /><input type="submit" value="Отправить сообщение"></td></tr>
</table>

А это код всплывающего окна

<!--<Заказать>--> 
<script type="text/javascript"> 
   function openchat(){new _uWnd('chat','Отправьте заявку',500,500,{align:0,shadow:0,close:1,autosize:1,maxh:600,minh:300,modal:1,resize:0,nomove:1}, $("#chat").html() )} 
</script> 
<div style="display:none;" id="chat">$MFORM_3$</div> 
   <!--</Заказать>-->

Garri Gray,

Я вижу такой бред вы добавили:

#table1 font {
  Â  position: relative;
  Â  left: 155.5px;
  Â  top: 4px;
}
#table1 select {
  Â  width: 95%;
}

не знаю какими вы редакторами пользуетесь, но мусор добавляется к стилям. Удалите все символы как в примере выделенно красным, либо перейдите в старую ПУ - http://www.ucoz.ru/qa/index.php/56614 и добавьте стили с нее.

Yuri_Geruk,

Версия панели старая.

Я скопировал код с сайта и вставил "Ctrl+V"

Муссор не был виден в стилях, просто пробелы, на скрине это видно.

Я вроде удалил не нужное, у меня именно Â  Â не было видно.

В результате звездочки сдвинулись вправо

 

Garri Gray,
Ну вот, все правильно, вижу нашли и исправили ошибки, если вы не видите результата, очистите кеш браузера.
...