Jump to content
  • 0

"Резиновые" элементы форм


Poca
 Share

Question

Подскажите, пожалуйста, можно ли стандартными средствами html/css (без использования JavaScript) сделать резиновые элменты управления формы?

Мне хотелось бы сделать форму, в которой правая граница элементов управления была бы всегда на одном расстоянии от правой границы формы.

Link to comment
Share on other sites

19 answers to this question

Recommended Posts

  • 0
Подскажите, пожалуйста, можно ли стандартными средствами html/css (без использования JavaScript) сделать резиновые элменты управления формы?

Мне хотелось бы сделать форму, в которой правая граница элементов управления была бы всегда на одном расстоянии от правой границы формы.

Ничего не понял.

Можно подробнее, с рисунками, с примерами кода?

Link to comment
Share on other sites

  • 0

Форма на странице имеет ширину 100%. Реальная ширина формы в общем случае нам неизвестна, так как зависит от разрешения экрана, размера окна браузера и т.д.

html:

<form>

<label for="foo">Введите текст:</label>

<input type="text" name="foo" id="foo" />

</form>

css:

label {

float : left;

width : 150px;

}

input {

margin-left : 155px;

width : auto; <—- не работает

width : 100%; <—- не работает

margin-right : 4px; <—- не работает

}

Задача: сделать так, чтобы независимо от фактического размера формы у элемента <input> правая граница (проще говоря margin-right) было N пикселей всегда.

Я не знаю как проще объяснить =(

Edited by Poca
Link to comment
Share on other sites

  • 0

Вариант не идеален, но:

<style>
html, body {
width : 100%;
margin:0;
padding:0;
}
label {
float:left;
width:150px;
border:#333333 solid 1px;
}

input {
position:absolute;
top:0;
right:4px;
border:#FF0000 dotted 1px;
width : 80%;
}
</style>
</head>

<body>
<form>
<label for="foo">Введите текст:</label>
<input type="text" name="foo" id="foo" />
</form>

Link to comment
Share on other sites

  • 0
Я не знаю как проще объяснить =(

Не проще надо, а достаточно внятно.

Упрощенный код

<div>
<label />
<input />
</div>

div
{
margin: 0px 4px 0px 150px;
}
label
{
width: 140px; floa: left;
}
input
{
width: 100%;
}

Копай в эту сторону. У ИЕ есть ряд проблем, но, думаю, обойти можно.

Link to comment
Share on other sites

  • 0
спасибо. не работает.

От меня полностью рабочий код вы никогда не дождетесь. Начните думать своей головой. Направление куда копать дали.

Да, и не работает, потому что в коде есть ошибка.

Edited by s0rr0w
Link to comment
Share on other sites

  • 0
От меня полностью рабочий код вы никогда не дождетесь. Начните думать своей головой. Направление куда копать дали.

Да, и не работает, потому что в коде есть ошибка.

Если вы про опечатку во float, то она конечно мной была сразу замечена и исправлена.

А вообще, мне очень неприятно, что вы мне хамите. Я, возможно, тут лишний человек, но я думаю было бы правильно просто сказать об этом сразу. Еще раз прошу спасибо за помощь и извините за моей вопрос - больше не буду вам мешать и появляться на этом форуме.

Link to comment
Share on other sites

  • 0
Если вы про опечатку во float, то она конечно мной была сразу замечена и исправлена.

А вообще, мне очень неприятно, что вы мне хамите. Я, возможно, тут лишний человек, но я думаю было бы правильно просто сказать об этом сразу. Еще раз прошу спасибо за помощь и извините за моей вопрос - больше не буду вам мешать и появляться на этом форуме.

О, я еще и хамлю оказывается... :)

Да без проблем, можете не появляться на форуме.

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

Удачи!

Link to comment
Share on other sites

  • 0
От меня полностью рабочий код вы никогда не дождетесь. Начните думать своей головой. Направление куда копать дали.

+1 к s0rr0w

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

Как говориться, хочешь помочь голодающему - не давай ему рыбу а дай ему удочку. :)

Link to comment
Share on other sites

  • 0

Я в течение всей последней недели разрабатываю панель администрирования некоторым контентом для сайта компании. В принципе вопросов не возникало ни на одном этапе, за исключением этого. Уже несколько дней я стараюсь решить этот вопрос. Было испробована масса вариантов, в том числе и те, которые предоложили здесь. Когда все мои варинты были исчерпаны, мне пришлось задать вопрос на вашем форуме.

Я прекрасно понимаю, что нужно думать своей головой. Однако мои возможности ограничены моим IQ и опытом использования HTML - к сожалению (или к счастью) это не моя область. К тому же ответа в интернете не нашлось и с помощью поисковых систем.

Не совсем понимаю зачем тогда нужен форум, если человек, зайдя уже просто в тупик, задает вопрос, а ему отвечают "думайте своей головой". Я искренне благодарю вас за попытки помочь, но к сожалению ваши предложения не работают - всё это и даже больше было испробовано еще до того, как мой вопрос был задан на этом форуме.

Link to comment
Share on other sites

  • 0
Я в течение всей последней недели разрабатываю панель администрирования некоторым контентом для сайта компании.

Вы за это получаете деньги. А мы - ничего. Почему мы должны вам помогать зарабатывать деньги?

Link to comment
Share on other sites

  • 0
Почему мы должны вам помогать зарабатывать деньги?

А где я это утверждаю?

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

P.S.: Жаль, что фидо медленно, но верно умирает =( Там считалось позорным выложить непроверенный код с ошибками =(

Edited by Poca
Link to comment
Share on other sites

  • 0
А где я это утверждаю?

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

P.S.: Жаль, что фидо медленно, но верно умирает =( Там считалось позорным выложить непроверенный код с ошибками =(

Вы для какой-то компании это делаете. Бесплатно? Или вы зарплату получаете?

Если я вам скажу, что мне нужно вскопать огород, кто может сделать, помогите, вы пойдете мне копать огород? Я думаю, что бесплатно - нет. И за маленькую плату тоже нет. Я ценю свои знания, а вы мои - нет. Я ценю знания, потому что я кропотливо их собирал на протяжении не одного года, а вы хотите получить все готовое. Я вам чем-то обязан? Я думаю, что никто тут ничем вам не обязан.

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

Чтобы научить человека плавать - бросьте его в воду.

Link to comment
Share on other sites

  • 0
Вы для какой-то компании это делаете. Бесплатно? Или вы зарплату получаете?

Если я вам скажу, что мне нужно вскопать огород, кто может сделать, помогите, вы пойдете мне копать огород? Я думаю, что бесплатно - нет. И за маленькую плату тоже нет. Я ценю свои знания, а вы мои - нет. Я ценю знания, потому что я кропотливо их собирал на протяжении не одного года, а вы хотите получить все готовое. Я вам чем-то обязан? Я думаю, что никто тут ничем вам не обязан.

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

Чтобы научить человека плавать - бросьте его в воду.

Поверьте мне, в моем возрасте поздно учиться думать. В той области, в которой я специалист, я решаю задачи горадо более сложные задачи с помощью своей головы. Не нужно учить меня думать - вам на это уже был дан неоднократный ответ. Мало того, вы абсолютно не знаете меня. Еще раз повторяю - я не считаю, что мне тут кто-то должен. Не понимаю с чего вы это взяли и зачем мне об этом говорите. Неужели вы действительно не понимаете, что ведете себя невежливо?

Знаете, мне очень неудобно, что мне пришлось тут задать вопрос. Как так так сложилось, что обычно, что вопросы задают мне. И меня тоже часто раздражает, когда люди не хотят думать своей головой, но данный случай - совершенно другая ситуация.

С моей стороны ваше поведение выглядит так: "я не понял вопроса, я не знаю ответа, вот тебе твой же кусок кода, разбирайся сама, дура". Я вполне допускаю, что у вас совершенно другие мотивы, но это мое видение и мое отношение к вашим ответам.

И прошу вас - заканчивайте обвинять меня в том, что я от кого-то что-то требую. В данной теме на это нет даже и намека. Вы сами это выдумали и начинаете меня в этом обвинять. Думаю причина проста - просто по сути вопроса вам ответить нечего.

Парадокс, но именно за этот проект, мне не заплатят ни копейки. Так что и тут вы ошиблись. И я даже могу не упоминать об этом, поэтому не считаю, что это важно - ищу я помощи в процессе зарабатывания денег или в процессе обучения (для того чтобы зарабатывать эти деньги позже). Все зависит от вашего желания - хотите вы помочь или нет. У меня и в мыслях не было что-то от кого-то требовать или обвинять кого угодно в нежелании помочь.

Более того - заглядывать в чужой карман тоже не принято.

Считаете, что ваш опыт стоит денег? Пожалуйста, предложите цену за решение задачи. Если цена меня устроит, я вам заплачу. Даже более того, я не исключаю возможности принять на работу опытного веб-программиста.

По теме: Еще раз повторюсь - спасибо за попытку помочь. К сожалению этот способ и другие были мной использованы до создания этой темы на вашем форуме. Поиски других решений приводят меня к выводу, что решения в заданных условиях не существует.

Если вам есть что добавить или уточнить по этому вопросы - с удовольствем продолжу диалог. Если же вы считаете вправе учить меня, что-же это ваше право и ваша совесть. Я же здесь не за этим...

Edited by Poca
Link to comment
Share on other sites

  • 0
В той области, в которой я специалист, я решаю задачи горадо более сложные задачи с помощью своей головы. Не нужно учить меня думать - вам на это уже был дан неоднократный ответ. Мало того, вы абсолютно не знаете меня. Еще раз повторяю - я не считаю, что мне тут кто-то должен. Не понимаю с чего вы это взяли и зачем мне об этом говорите. Неужели вы действительно не понимаете, что ведете себя невежливо?

Если вы специалист и все такое, у меня есть простой вопрос, а какого вы полезли туда, в чем ни бум-бум? Найдите специалиста, который сделает вам нужное за пять минут! Упс, ему придется чем-то заплатить. Ай-я-яй... незадача вышла. :)

Знаете, мне очень неудобно, что мне пришлось тут задать вопрос. Как так так сложилось, что обычно, что вопросы задают мне. И меня тоже часто раздражает, когда люди не хотят думать своей головой, но данный случай - совершенно другая ситуация.

Абсолютно верно, другая. Потому что теперь вы находитесь в ситуации, когда вам не хватает знаний понять, что вам дали вполне реальное направление, двигаясь по которому, можно было еще два дня назад решить примитивную задачку. Достаточно было почитать данный ресурс.

С моей стороны ваше поведение выглядит так: "я не понял вопроса, я не знаю ответа, вот тебе твой же кусок кода, разбирайся сама, дура". Я вполне допускаю, что у вас совершенно другие мотивы, но это мое видение и мое отношение к вашим ответам.

Опять же не удивительно. Потому что я знаю правильный ответ, а вы- нет. И то, что я не дал вам конфету сразу, бесит вас. И никто его не даст, потому что половина не знает, а вторая половина - из принципа. Может и найдутся благородные рыцари, которые выдадут конфету, но это исключение из правил.

И прошу вас - заканчивайте обвинять меня в том, что я от кого-то что-то требую. В данной теме на это нет даже и намека. Вы сами это выдумали и начинаете меня в этом обвинять. Думаю причина проста - просто по сути вопроса вам ответить нечего.

Парадокс, но именно за этот проект, мне не заплатят ни копейки. Так что и тут вы ошиблись. И я даже могу не упоминать об этом, поэтому не считаю, что это важно - ищу я помощи в процессе зарабатывания денег или в процессе обучения (для того чтобы зарабатывать эти деньги позже). Все зависит от вашего желания - хотите вы помочь или нет. У меня и в мыслях не было что-то от кого-то требовать или обвинять кого угодно в нежелании помочь.

Если вы хотите учиться - учитесь, и я вам помогу. Учиться. А зарабатывать деньги - нет, уж извините, но мне их никто не помогает зарабатывать.

Еще раз повторюсь - спасибо за попытку помочь. К сожалению этот способ и другие были мной использованы до создания этой темы на вашем форуме. Поиски других решений приводят меня к выводу, что решения в заданных условиях не существует.

Решения есть. :(

Если вам есть что добавить или уточнить по этому вопросы - с удовольствем продолжу диалог. Если же вы считаете вправе учить меня, что-же это ваше право и ваша совесть. Я же здесь не за этим...

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

Ну да ладно.

Link to comment
Share on other sites

  • 0

Вобщем, решение найдено. Вернее - проблема браузера, который в основном будет использоваться для этой системы.

Еще раз всем спасибо за помощь и извините еще раз, если кого-то мой вопрос обидел или задел каким-то другим образом. Прошу закрыть тему.

P.S.: s0rr0w, вы все-таки определитесь - или вам жалко бесплатно делиться своим опытом - в этом случае, я думаю, надо было называть цену, или вы хотите чему-то научить - тогда не стоит, на мой взгляд, выкладывать непроверенный код с ошибками - в нем нет никакой образовательной ценности. Тем более что точно такой же код был мной написан до вопроса на форуме - для этого вполне достаточно и моего крошечного опыта.

Edited by Poca
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy