user1652801
user1652801

Reputation: 11

How to make a div right after a text box?

How to make a div right after a text box(in the same line) ?

        <!--Text box -->
        Title: <input type="text" name="textbox1" placeholder="Type here"
            class="inputs" />
        <!-- dropdown menu -->
        <div class="select-style">
            <select class="dropdown" Name="color" onchange="">
                <option value="" class="label" value="">Text Color</option>
                <option value="black">Black</option>
                <option value="blue">Blue</option>
                <option value="green">Green</option>
                <option value="red">Red</option>
            </select>
        </div>

Upvotes: 1

Views: 103

Answers (4)

Esha Jain
Esha Jain

Reputation: 555

    Title: <input type="text" name="textbox1" placeholder="Type here"
        class="inputs" />

    <!-- dropdown menu -->
    <span class="select-style">
        <select class="dropdown" Name="color" onchange="">
            <option value="" class="label" value="">Text Color</option>
            <option value="black">Black</option>
            <option value="blue">Blue</option>
            <option value="green">Green</option>
            <option value="red">Red</option>
        </select>
    </span>

its working for me

Upvotes: 1

James
James

Reputation: 2201

Just add this rule to your css file:

.select-style{
    display: inline;
}

Here's a jsfiddle

Or if you wish to use inline styles add this to your div:

 <div style="display: inline" class="select-style">

Upvotes: 1

mahega
mahega

Reputation: 3311

You should use span, because it's an inline element. And div is a block element which always breaks line.

See JFiddle: http://jsfiddle.net/VC7DD/

<!--Text box -->
Title: <input type="text" name="textbox1" placeholder="Type here"
    class="inputs" />
<!-- dropdown menu -->
<span class="select-style">
    <select class="dropdown" Name="color" onchange="">
        <option value="" class="label" value="">Text Color</option>
        <option value="black">Black</option>
        <option value="blue">Blue</option>
        <option value="green">Green</option>
        <option value="red">Red</option>
    </select>
</span>

Upvotes: 0

dev7
dev7

Reputation: 6369

use CSS:

.select-style {display:inline-block;}

Hope this helps!

Upvotes: 0

Related Questions