Показать сообщение отдельно
  #1 (permalink)  
Старый 26.01.2012, 16:42
Аспирант
Отправить личное сообщение для Gamestop Посмотреть профиль Найти все сообщения от Gamestop
 
Регистрация: 25.05.2011
Сообщений: 93

Как сверстать такую форму?
Пробовал таблицей, но таблица слишком громоздка,


проблема в том что картинки "Вход", всегда выше находится чем inputs, сама картинка есть <input type="image" /> - правильно-ли это??

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

я думаю сделать так

<div class="Серый блок который на всю ширину">
<div class="Блок в 980px такой размер нужен, он равен макету">
<img src="register.jpg" /> - это в левый край
<form>
логин
<input type="text" />
пароль
<input type="text" />
<input type="image" src="..." />
</form>
</div>
</div>

как вы думаете правильно-ли???

для выравнивания по центру я пробовал height: 50px; line-height:50px;
тока вот это свойство для формы ненаследуется, опять чтоли писать
или просто сделать display: table-cell??

я вот немогу понять какие свойства css надо применить для формы чтобы она в строчку и по центру элементы inputs, img или <input type="image" /> запутался и криво получилось

+ видите-ли надо чтобы когда пользователь войдёт, использовалась эта же структура, ну там будет тоже текст и картинки, конечно у них уже отдельно придётся отсутпы настраивать, ну главное я хочу понять структуру такого вот входа для пользователя сверху, просьба без таблиц, а то я использовал таблицы, там своя заморочка с td, ведь нужно-же чтобы код был чистым и лаконичным и главное понятным, если выложите примерчик прошу обьяснить по пальцам что и почему, буду благодарен, спасибо!!

мне ненужно для ie 6, мне просто нужно чтобы все современные браузеры это нормально отображали , что в принципе и наверняка и будет, просто как правильно это организовать, чтобы вот посомтреть на этот код и стало легко на душе)
Подскажите плизз

Картинку прикрепил внизу, кликните на неё чтобы посмотреть что я хочу сделать
Изображения:
Тип файла: jpg top.jpg (34.0 Кб, 12 просмотров)

Последний раз редактировалось Gamestop, 26.01.2012 в 16:53.
Ответить с цитированием