Saturday, 15 January 2011

html - Put two input boxes and divs on same row -



html - Put two input boxes and divs on same row -

i have next html:

<div class="onerow"> site id: <input type="text" name="siteid" id="siteid" class="k-textbox" data-bind="value: siteid"/>&nbsp; </div> <div class="onerow"> <div id="select"> <label for="state">view:</label>&nbsp;&nbsp;&nbsp; <select id="state" data-role="dropdownlist" data-bind="value: state" data-option-label="select state"> <option value="2">all</option> <option value="1">active</option> <option value="3">all except deleted</option> </select> <input type="button" id="buttonsearch" value="search" class="k-button" data-bind="events: {click: onsearchclick}"/> </div> </div>

or, in jsfiddle: http://jsfiddle.net/j7ksuv9y/

i want position both of on same row, 1 after other. i've tried using style="float: right" ends placing sec input box far right of screen, not want.

how might accomplish this?

add next css :

.onerow { display: inline-block; }

this create element display inline block.

quote mdn

the element generates block element box flowed surrounding content if single inline box (behaving much replaced element would)

updated fiddle

html css layout

No comments:

Post a Comment