How to align two <div> tags horizontally in the same line inside a main <div> tag? [duplicate]

Question

I am trying to use two <div> elements inside a main <div>. But the problem is, in the first <div> I am using an <image> control and along with it I am fetching some text data from the database. And in second <div> I am using a <gridview>. But I am unable to show these two <div> elements in same line horizontally.

I have tried doing this:

<div style="width:1000px;overflow:hidden; height:auto; float:left; text-align:justify; margin-bottom:15px;">
    <div id="right part" runat="server" style="width:auto; float:left; margin:0 12px 12px 0;">
        <asp:Image ID="Image1" runat="server" Height="122px" Width="148px" /><% =details %></div>
    <div id="left part" runat="server" style="float:left;width:auto;display:inline-block;">
        <asp:GridView ID="GridView1" runat="server" ShowHeader="False" 
                      ForeColor="Black" GridLines="None" EnableModelValidation="True" 
                      onpageindexchanging="GridView1_PageIndexChanging" onrowcreated="GridView1_RowCreated">
        </asp:GridView>    
    </div>
</div>

Please suggest me if I am doing something wrong?

Answer 1

css

display:inline-block

add div right part and left part css

Answer 2

Set 'right part' div float to right. Please check, you are using space in id selectors which is not right.