CSS在div旁边放置div [英] CSS placing a div beside a div

问题描述

我想知道为什么我的div不是旁边的其他div？

I was wondering why my div isn't next to the other div? It isn't placing it next to each other but below each other, i don't know why it is doing that.

.form-search #search {
    width: 485px;
}


.form-search #search #baaninput input {
    width: 240px;
    height: 123px;
    background-color: blue;
    float: left;
 
}

.form-search #search #plaatsinput input {
    width: 240px;
    height: 123px;
    background-color: green;
    float: right;
}


.form-search input {
    margin-top: -15px;
    margin-left: -15px;
    padding: 0px 5px;
    float: left;
    font: bold 15px "lucida sans","trebuchet MS","Tahoma";
    border: 0px none;
    background: none repeat scroll 0% 0% rgba(0,0,0,0);
}

.form-search button:before {
    content: "";
    position: absolute;
    border-width: 8px 8px 8px 0px;
    border-style: solid solid solid none;
    border-color: transparent #D83C3C;
    top: 18px;
    left: -6px;
}

.form-search button {
    left: 140px;
    margin-top: -40px;
    overflow: visible;
    position: relative;
    float: right;
    border: 0px none;
    padding: 0px ;
    cursor: pointer;
    height: 50p`x;
    width: 110px;
    font: bold 15px/40px "lucida sans","trebuchet MS","Tahoma";
    color: #FFF;
    text-transform: uppercase;
    background: none repeat scroll 0% 0% #D83C3C;
    border-radius: 0px 3px 3px 0px;
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.3);
}

<form class="form-search">
                            <div id="search">
                            <div id="baaninput">
                                <fieldset>
                                    <input type="text" required="" placeholder="Baan naam hier...">
                                    </input>
                                </fieldset>
                            </div>

                            <div id="plaatsinput">
                                <fieldset>
                                    <input type="text" required="" placeholder="Plaats naam hier..."></input>
                                 </fieldset>
                            </div>

                            <button type="submit">
                                Zoeken
                            </button>
                             </div>



                        </form>

我不知道为什么

感谢您查看我的代码。

尊敬的，
Johan

Regards, Johan

推荐答案

在您的代码中添加以下css

Add following css in your code

#baaninput,#plaatsinput
{
width: 50%;
float:left;
}

这篇关于CSS在div旁边放置div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！