Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

Tags:

html

css

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?

like image 943
Omi Avatar asked Dec 05 '22 08:12

Omi


2 Answers

css

display:inline-block

add div right part and left part css

like image 148
Bip Avatar answered May 30 '23 23:05

Bip


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

like image 39
Kunj Avatar answered May 31 '23 00:05

Kunj