Показать сообщение отдельно
  #3 (permalink)  
Старый 12.09.2016, 20:05
Интересующийся
Отправить личное сообщение для Franky83 Посмотреть профиль Найти все сообщения от Franky83
 
Регистрация: 11.09.2016
Сообщений: 11

Спасибо за Ваше решение. Но надо чтобы в одну строку всё было.
Средствами css не знаю как сделать. С помощью JS , вот так у меня получилось
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>


    </style>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.js"></script>
    <script>
        $(document).ready(function () {
            $('.textField').each(function (inx, item) {

                var parent = $(item).parent().outerWidth();
                var span = $(item).outerWidth();
                var input = $('<input/>').attr({type: 'text', class: 'd'});

                $(input).width(parent - span - 20);
                $(input).insertAfter(item);
            });


        })
    </script>
    <style>

        .main {
            position: relative;
            width: 600px;
            padding: 10px 0;
            background-color: #f35800;
        }

        .dd {
            position: relative;
            margin: 10px;
        }

        .d {
            position: absolute;
            width: 100%;
        }

        .textField {
            padding: 0 20px;

        }
    </style>
</head>
<body>
<div class="main">
    <div class="dd">
        <span class="textField">Subject: </span>

    </div>
    <div class="dd">
        <span class="textField">From: </span>

    </div>
    <div class="dd">
        <span class="textField">To: </span>

    </div>
</div>
</body>
</html>
Ответить с цитированием