Форум программистов, компьютерный форум, киберфорум
Наши страницы
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.70/10: Рейтинг темы: голосов - 10, средняя оценка - 4.70
akamoroz
0 / 0 / 0
Регистрация: 11.03.2011
Сообщений: 6
1

CSS верстка формы UL

14.03.2011, 11:52. Просмотров 1746. Ответов 2
Метки нет (Все метки)

Извините за новичковскую просьбу, но никак не могу сверстать простенькую форму.
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<div id="content_feedback">
<form id="form_feedback" method="post" action="/feedback/add_answer/">
<p>Обязательные для заполнения поля помечены звездочкой</p>
<ul>
<li><label for="id_name">Ваше имя*:</label> <input id="id_name" type="text" name="name" maxlength="100"></li>
<li><label for="id_email">Ваш e-mail:</label> <input id="id_email" type="text" name="email" maxlength="100"></li>
<li><label for="id_city">Город:</label> <input id="id_city" type="text" name="city" maxlength="100"></li>
<li id="hide_feedback"><a href="#" id="hide_feedback" class="form">Скрыть/показать анкетирование</a><br></li>
<li id="vote_feedback"><label for="custom_2">Нравится:</label>
            <label class="feed_vote" for="vote_1"><input id="vote_1" type="radio" name="2" value="1">да</label> 
            <label class="feed_vote" for="vote_2"><input id="vote_2" type="radio" name="2" value="2">нет</label>        
            <label class="feed_vote" for="vote_3"><input id="vote_3" type="radio" name="2" value="3">не знаю</label>
    </li>
<li><label for="custom_1">Отзыв:</label><textarea id="custom_1" name="1" cols="40" rows="3"></textarea></li>
<li><label></label><input type="submit" value="Отправить вопрос"></li></ul>
</form>
</div>
CSS, который я написал
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
#content_feedback { 
    padding-top: 15px; 
    display: block; 
}
#content_feedback form {
    display:block; 
    padding: 0; 
    float: left; 
    width: 100%; 
}
#content_feedback label, #content_feedback a.form {
    padding: 1px 4px;
    margin: auto auto;
    width: 30%;
    float: left;
    clear: left;
    text-align: right;}
#content_feedback input { 
    margin-top: 2px;
}
#content_feedback ul { 
    list-style:none; 
    margin: 0px; 
}
Вот что получается:
CSS верстка формы UL

Чего я хочу добиться:
CSS верстка формы UL


Спасибо большое за помощь.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
14.03.2011, 11:52
Ответы с готовыми решениями:

Верстка с CSS
Здравствуйте! У меня произошла такая проблема, если просмотреть страничку через...

верстка CSS
здравствуйте, не как не получается заверстать блоками, пример как должно быть...

Верстка CSS
На сайте используется двухколонная верстка: #center { margin-right:230px; }...

HTML+CSS верстка
Помогите,пожалуйста, не могу понять, что не так в этой трехколоночной верстке....

CSS верстка таблиц
Всем привет! Сейчас делаю таблицу (HTML+CSS) JS использовать нельзя. Так вот...

2
LeD4eG
14 / 14 / 0
Регистрация: 29.09.2009
Сообщений: 79
14.03.2011, 12:33 2
akamoroz, я думаю список для хранения элементов формы - это немного лишнее.
а ничего, что то, что Вы получаете, и к чему стремитесь - разные формы???
0
akamoroz
0 / 0 / 0
Регистрация: 11.03.2011
Сообщений: 6
14.03.2011, 12:46  [ТС] 3
Дак я и прошу помощи.
Просто не получается два пункта:
что-бы каждый <li> был ниже предыдущего(а не вперемешку, как сейчас)
что-бы label с radio-input'ами так же был в правой "колонке"
0
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
14.03.2011, 12:46

Html+ css верстка
Здравствуйте, форумчане. Прошу вас помочь мне разобраться с кое-каким вопросом....

Верстка слайдера css
Добрый день! Имеется слайдер, при уменьшении страницы все прекрасно, слайдер...

Адаптивная верстка CSS
Здравствуйте, у меня такая проблема. делаю адаптивную верстку для страницы. В...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru