Нестандартный input

[fenix_63]

Всем привет. Народ, может кто сталкивался. Нужно сверстать нестандартный input, а именно вот такой:

 

https://fotki.yandex.ru/next/users/tltfenix/album/74102/view/988639

 

Помогите пожалуйста, а то я уже голову сломал, ну не знаю как этот инпут на 2 части делить. ((

[Нарек]

Почему делить? Делай 2 инпута.

[Mozzie]

Мне одному кажется что люди думать не хотят?

[fenix_63]

Хотят люди думать. Попробую таблично сделать. В строку 2 ячейки, а в них у же инпуты.

[sigma77]

Не нужна тут таблица.

[Нарек]

Попробую таблично сделать.

Таблицы для того чтобы верстать таблицы. У тебя там не таблица. Просто поставь 2 инпута со своими label рядом друг с другом и все. 

[fenix_63]

Выкладываю архив с тем, что у меня есть:

https://yadi.sk/d/3_r86X0pkJvLA

 

У меня там всё таки на таблице сделано. Та ячейка где "До:   26-01-2015". Только она вправо съехала. Мне надо её прижать к первой ячейке "Начиная с".

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

[Нарек]

То что есть залей в песочницу или на хостинг, мало кому захочется качать не знаю что.

[fenix_63]

Вот:  http://youran88.hol.es

[Mozzie]

Вот:  http://youran88.hol.es

position: relative;right: 190px;

Добавляем к индефикатору #to_date

Edited November 8, 2015 by Mozzie

[fenix_63]

Спасибо большое Mozzie, и всем кто помогал. Вы делаете мир лучше. Учусь на ошибках ).

[Нарек]

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

Мой тебе совет, во первых ставить вместо текста картинки - грубейшая глупость. Во вторых, давать ширину по id каждому инпуту тоже глупо, учитывая то, что они все имеют белый фон. Например:

http://joxi.ru/vAWDMypfvzP5rW то что ты хочешь получить.таблица, несколько tr в каждом по 2 td. Для каждого второго td даем text-align: right; и все.

То что сейчас - никуда не годится.

[fenix_63]

спс, учту. А как быть в таком случае например с ячейкой "До". У этой ячейки До - постоянная часть, которая не меняется, а вот сама дата - placeholder. С метками хз как реализовать чтоб внешне также выглядело.

Edited November 8, 2015 by fenix_63

[Mozzie]

Может подскажете как максимально безболезненно сделать исходя из того, что у меня есть

 

 

position: relative; right: 190px; Добавляем к индефикатору #to_date

 

 

 

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

Мой тебе совет, во первых ставить вместо текста картинки - грубейшая глупость. Во вторых, давать ширину по id каждому инпуту тоже глупо, учитывая то, что они все имеют белый фон. Например:

http://joxi.ru/vAWDMypfvzP5rW то что ты хочешь получить.таблица, несколько tr в каждом по 2 td. Для каждого второго td даем text-align: right; и все.

То что сейчас - никуда не годится.

Там по хорошему всю таблицу надо переделывать.

[VeniVidiVici]

Вопрос, обязательно ли эти поля в таблице делать?

Вот такая реализация приемлема?(грубый пример общей структуры)

<div>  <label for=""><input type="text"></div>.....<div> <label for=""><input type="text"></div>

[fenix_63]

Надо все поля делать. всё должно быт как в макете:  https://fotki.yandex.ru/next/users/tltfenix/album/74102/view/988737.  С метками я пока не стал делать, т.к. не знаю как это правильно оформить чтоб было прям как в макете.