CODEWITHSUNDEEP
javascriptjqueryhtmljquery-uijquery-ui-autocomplete
Bhushan
Bhushan

Reputation: 6181

positioning jquery-ui-combify

I am using jquery.ui.combify.

Following is my HTML file:

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/base/jquery-ui.css" type="text/css" media="all" />
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
        <link rel="stylesheet" type="text/css" href="jqgridcss/jquery.ui.combify.css" />
        <script type="text/javascript" src="jqgridjs/jquery.ui.combify.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#MySelect").combify();
            $("#MySelect2").combify();
        });
    </script>
    </head>
    <select id="MySelect">
        <option>Some Option</option>
        <option>Some Other Option</option>
    </select>
    <select id="MySelect2">
        <option>Some Option</option>
        <option>Some Other Option</option>
    </select>
</html>

I have two combo-boxes, which I want to show in a single line, but I am getting this two combo-boxes on separate lines.

This is how combo-boxes should appear:

select1

But they are appearing like:

enter image description here

So let me know if there is a solution for this.

Thanks in advance..

Upvotes: 0

Views: 637

Answers (2)

sasi
sasi

Reputation: 4318

#MySelect{float:left;}
#MySelect2{float:left;}

use float:left or float:right

Upvotes: 1

Dineshkumar
Dineshkumar

Reputation: 361

try this code ....

<html>
<body>
    <table>
    <tr>
     <td><select id="MySelect">
            <option>Some Option</option>
            <option>Some Other Option</option>
        </select> 
     </td>
    <td>
    <select id="MySelect2">
            <option>Some Option</option>
            <option>Some Other Option</option>
        </select>
    </td>
    </tr>
    </body>
</html>

Upvotes: 0

Related Questions