За последние 24 часа нас посетили 16686 программистов и 1651 робот. Сейчас ищут 1870 программистов ...

HTML и CSS что делать что бы так сделать

Тема в разделе "HTML и CSS", создана пользователем VLK, 25 июн 2014.

  1. VLK

    VLK Старожил

    С нами с:
    15 дек 2013
    Сообщения:
    3.010
    Симпатии:
    58
    Есть текстовое поле textarea под ним 2 элемента, первый это какой то текст, например описание, а справа кнопка, выглядит это примерно так:
    http://s008.radikal.ru/i306/1406/fe/c20c157666cb.jpg

    подскажите, возможно ли такое организовать при помощи блоков div, но без таблицы (table, td) и каких то конкретных значений.

    Таблицу (table, td) я не хочу использовать потому что, этот код к одному из плагинов к одной известной CMS, на каком шаблоне будет использоваться и какие настройки будут у этого шаблона неизвестно, бывает такое что по умолчанию у таблицы отображаются границы, а мне не надо что бы какие то линии отображались, короче как то так.

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

    Код (Text):
    1. <div style="width: 300px;" >
    2.  
    3.     <div>
    4.         <div><textarea rows="5" cols="30"></textarea></div>
    5.  
    6.         <div style="float:left;">some text</div>
    7.  
    8.         <div style="float:right;"><input type="submit" value="insert"></div>
    9.  
    10.         <div style="clear:both;"></div>
    11.     </div>
    12.     <div>text after</div>
    13.  
    14. </div>
     
  2. YSandro

    YSandro Старожил

    С нами с:
    7 апр 2011
    Сообщения:
    2.523
    Симпатии:
    2
    1. Укажи элементам с текстом и скнопкой ширину (230 и 70 px).
    2. Элемент float:right; (с кнопкой) ставь перед элементом с текстом.

    http://cssdeck.com/labs/iyvhhq0v
     
  3. VLK

    VLK Старожил

    С нами с:
    15 дек 2013
    Сообщения:
    3.010
    Симпатии:
    58
    Спасибо, а если я задаю в процентном соотношении (мне надо удалиться от конкретных цифр) то эти проценты будут от вышестоящего элемента (тега)?

    т.е.
    Код (Text):
    1. <div id="main">
    2. <div id="one"></div><div id="two"></div>
    3. </div>
    допустим one 70%, а two 30%, эти проценты идут от main?

    и еще вопрос, что бы все не расплывалось у меня стоит
    Код (Text):
    1. <div style="clear:both;"></div>
    а тут в коде я не вижу и все вроде работает, не расплывается, как так?
     
  4. YSandro

    YSandro Старожил

    С нами с:
    7 апр 2011
    Сообщения:
    2.523
    Симпатии:
    2
    Да. Можно ещё установить min-width для main, чтобы кнопка справа не наехала на текст когда-нибудь.