在左侧显示视频,在右侧的表单上方显示段落

时间:2015-04-28 10:14:23

标签: html css

我在这里没有想法,但我确定我错过了一些明显的东西。我希望视频向左浮动,联系人表单上方的段落全部向右浮动。该段是合作的,但表格就在那里。

<html>

    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <meta charset="UTF-8">
        <meta name="description" content- "best=" " junk=" " car=" " buyers=" "
in=" " austin"="">
        <meta name="author" content="Lucky">
        <title>ATX Junk Cars</title>
        <style>
            iframe {
                clear: left;
                float: left;
            }
            <p> {
                float: right;
                display: inline-block;
                vertical-align: middle;
                float: right;
                padding-left: 50px;
                padding-top: 50px;
            }
        </style>
    </head>

    <body>

<h1> ATX Junk           Cars&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbs    p;

&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&n    bsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;




<hr size="2" width="100%"> </h1>

        <iframe src="https://www.youtube.com/embed/dNWh2w5VSn4" allowfullscreen="" width="700" frameborder="0" height="450"></iframe>
        <p>If you're ready to turn that old car in your driveway into cash, we want to hear from you. Tell us who you are, how we can reach you, and most important, tell us about that car. For the fastest response, call or send a text to 512-229-5424. If it's 2:00 in the morning or you just don't like phones, send us a message with the form below.</p>
        <br>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Contact Form</title>
        <style>
            body {
                background-color: #330000;
                color: ffcc00;
        </style>
        <style>
            label {
                display:block;
                margin-top:20px;
                letter-spacing:2px;
        </style>
        <style>
            /* Centre the page */
            .body {
                display:block;
                margin:0 auto;
                width:576px;
            }
            /* Centre the form within the page */
            form {
                margin:0 auto;
                width:459px;
            }
            /* Style the text boxes */
            input, textarea {
                width:439px;
                height:32px;
                background:#efefef;
                border:1px solid #dedede;
                padding:10px;
                margin-top:3px;
                font-size:0.9em;
                color:#3a3a3a;
            }
            textarea {
                height:213px;
                background:url(images/textarea-bg.jpg) right no-repeat #efefef;
            }
        </style>
        <header class="body"></header>
        <section class="body">
            <label>Who are you?</label>
            <input name="name" placeholder="Name">
            <label>How do we call you?</label>
            <input name="phone" placeholder="Phone number with area code" type="phone">
            <label>Do you have keys and a clear title?</label>
            <input name="keys" placeholder="Keys, title or both?" type="keys">
            <label>Does it start, run and drive?</label>
            <input name="runs" placeholder="Yes or no?" type="runs">
            <label>Anything not working on it?</label>
            <textarea name="problems" placeholder="Dents, check engine lights, broken things?"></textarea>
            <input id="submit" name="submit" value="Submit" type="submit">
        </section>
        <footer class="body"></footer>
    </body>

</html>

1 个答案:

答案 0 :(得分:0)

添加style="float:right;",如下所示:

 <section class="body" style="float:right;">
 <label>Who are you?</label>
 <!-- your form code -->
 </section>