ASP.net organising a screen using <div> (sorry but couldn't delete SQL area only ASP relevant)

Hi

I have been asked to rearrange the following ASP.net web page that is divided up using <div...
I have no idea on how this works. The markup for the page is below followed with my currently disorganised screen. Could someone please give me a few pointers on how to organise the screen so the right hand side that I have managed to somehow force downward somehow comes up again into a neat design.
Thanks

<%@ Page Title="Placements" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Placements.aspx.cs" Inherits="CRM_GHB.Placements" EnableEventValidation="false" %>


<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">

<script type="text/javascript">
    $(function () {
        $('input#contact_search').quicksearch('.gvContacts tr:gt(0)');
    });
</script>

<link href="/Styles/crm.css" rel="stylesheet" type="text/css" media="screen" />

</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <div style="margin-top:10px;">
        <div id="col_left">
            <div class="sectionContent">
                <div class="sectionHeading">
                    <h3 style="float:left">Contacts</h3><span class="label">Search: <input id="contact_search" /></span>
                </div>

                <div style="width: 95%; height: 200px; overflow-y:scroll; margin:10px auto 0 auto;">
                        <asp:GridView ID="gvContacts" CssClass="gvContacts" runat="server"
                        AllowSorting="True" DataSourceID="SQL"
                        OnRowDataBound="gvContacts_RowDataBound" OnRowCommand="gvContacts_RowCommand"
                        OnSelectedIndexChanged="gvContacts_SelectedIndexChanged" AutoGenerateColumns="False"
                        >

                        <Columns>
                            <asp:BoundField DataField="Company" HeaderText="Company"
                                SortExpression="Company" />
                            <asp:BoundField DataField="Last_Name" HeaderText="Last_Name"
                                SortExpression="Last_Name" />
                            <asp:BoundField DataField="First_Name" HeaderText="First_Name"
                                SortExpression="First_Name" />
                            <asp:BoundField DataField="column1" HeaderText="column1"
                                SortExpression="column1" />
                        </Columns>

                        <HeaderStyle BackColor="#EDEEF0"  Font-Bold="True" />
                    </asp:GridView>
               
                      <asp:SqlDataSource ID="SQL" runat="server"
                        ConnectionString="<%$ ConnectionStrings:ConnectionString1 %>"
                       
                        SelectCommand="SELECT [Company], [Last Name] AS Last_Name, [First Name] AS First_Name, [E-mail Address] AS column1 FROM [Customers]"
                        ProviderName="<%$ ConnectionStrings:ConnectionString1.ProviderName %>">
                    </asp:SqlDataSource>
                  </div>
               
                <asp:TextBox id="txtContactID"  runat="server" value="-1" visible="false"/>
               
            </div>

            <div class="sectionContent">
                <div class="sectionHeading">
                    <h3>Notes</h3>
                </div>
               
                <div style="width: 95%; height: 200px; overflow-y:scroll; margin:10px auto 0 auto;">
                        <asp:GridView ID="gvNotes" CssClass="gvNotes" runat="server"
                        AllowSorting="True" DataSourceID="notes_SQL"
                        OnRowDataBound="gvNotes_RowDataBound"
                        OnSelectedIndexChanged="gvNotes_SelectedIndexChanged" AutoGenerateColumns="true"
                        >

                        <Columns>
                            <asp:CommandField ShowSelectButton="True" Visible="false"/>
                            <asp:ButtonField CommandName="Select" Visible="false" />
                        </Columns>

                        <HeaderStyle BackColor="#EDEEF0"  Font-Bold="True" />
                    </asp:GridView>
               
                      <asp:SqlDataSource ID="notes_SQL" runat="server"
                        ConnectionString="<%$ ConnectionStrings:ConnString %>"
                        SelectCommand="SELECT NoteId, [ContactId], Note,  ModifiedBy As [UpdatedBy], ModifiedOn As [Date Updated] FROM [tblNotes] where ContactId = @ContactID">
                        <SelectParameters>
                            <asp:ControlParameter Name="ContactID" ControlId="txtContactID" PropertyName="Text"  defaultvalue="5"/>    
                        </SelectParameters>
                    </asp:SqlDataSource>
                  </div>
            </div>

            </div>
        </div>
       
        <div id="col_right">
            <div class="sectionContent">
                <div class="sectionHeading">
                    <h3>My Investment Status</h3>
                </div>
                <div style="width: 95%; height: 200px; overflow-y:scroll; margin:10px auto 0 auto;">
                        <asp:GridView ID="gvMyInvestments" CssClass="gvMyInvestments" runat="server"
                        AllowSorting="True" DataSourceID="MyInvestments_sql"
                        AutoGenerateColumns="true"
                        >

                        <Columns>
                            <asp:CommandField ShowSelectButton="True" Visible="false"/>
                            <asp:ButtonField CommandName="Select" Visible="false" />
                        </Columns>

                        <HeaderStyle BackColor="#EDEEF0"  Font-Bold="True" />
                    </asp:GridView>
               
                      <asp:SqlDataSource ID="MyInvestments_sql" runat="server"
                        ConnectionString="<%$ ConnectionStrings:ConnString %>"
                        SelectCommand="SELECT Name, Investor FROM [viewMyInvestments]">
                       
                    </asp:SqlDataSource>
                  </div>
            </div>

            <div class="sectionContent">
                <div class="sectionHeading">
                    <h3>Active Investments</h3>
                </div>
                <div style="width: 95%; height: 200px; overflow-y:scroll; margin:10px auto 0 auto;">
                        <asp:GridView ID="gvActiveInvestments" CssClass="gvActiveInvestments" runat="server"
                        AllowSorting="True" DataSourceID="ActiveInvestments_sql"
                        AutoGenerateColumns="true"
                        >

                        <Columns>
                            <asp:CommandField ShowSelectButton="True" Visible="false"/>
                            <asp:ButtonField CommandName="Select" Visible="false" />
                        </Columns>

                        <HeaderStyle BackColor="#EDEEF0"  Font-Bold="True" />
                    </asp:GridView>
               
                      <asp:SqlDataSource ID="ActiveInvestments_sql" runat="server"
                        ConnectionString="<%$ ConnectionStrings:ConnString %>"
                        SelectCommand="SELECT Name, Type FROM [viewActiveInvestments]">
                       
                    </asp:SqlDataSource>
                  </div>
            </div>
        </div>
   
</asp:Content>

1
Murray BrownMicrosoft Cloud Azure/Excel Solution DeveloperAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

IanThCommented:
0
IanThCommented:
see

<link href="/Styles/crm.css" rel="stylesheet" type="text/css" media="screen" />

thats will have the div parameters in it
0
IanThCommented:
see the line
<h3 style="float:left">Contacts</h3><span class="label">Search: <input id="contact_search" /></span>
                </div>


try float:right
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Murray BrownMicrosoft Cloud Azure/Excel Solution DeveloperAuthor Commented:
thanks very much for all the help
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.