0

I have 4 <div> element first one is Header, 2nd and 3rd is Middle as right and left panel in the same row with fixed width and heigh and 4th <div> is footer.
How can I align the middle two <div> in the center

<div align="center" style ="background-color :Lime; height :30px">Heading</div>
    
    <div id ="leftAlign" align="center" style ="float:left ; background-color :Fuchsia ; width :45%">Left</div>
    <div id ="rightAlign" align="center" style ="float:left; margin:0px; background-color :Navy ; width :45%">Right</div>
    
    <div align="center" style ="background-color :Lime; clear :both ; height :30px">Heading</div>

Edited by __avd: Added [code] tags.

3
Contributors
2
Replies
3
Views
6 Years
Discussion Span
Last Post by Fortinbra
0

If I understood your question properly, this is what you are looking for:

<div>
        <div style="width: 694px; height: 30px">
            <div style="float: left; text-align: right; width: 340px;">
                <asp:Label ID="Label1" runat="server" Text="User Name:"></asp:Label>
            </div>
            <div style="float: right; width: 340px;">
                <asp:TextBox ID="txtUserName" runat="server"></asp:TextBox>
            </div>
        </div>
        <div style="width: 694px; height: 30px">
            <div style="float: left; text-align: right; width: 340px">
                <asp:Label ID="Label2" runat="server" Text="Password:"></asp:Label>
            </div>
            <div style="float: right; width: 340px;">
                <asp:TextBox ID="txtPassword" runat="server" TextMode="Password"></asp:TextBox>
            </div>
        </div>
        <div style="width: 694px; height: 30px">
         <center>
            <a href="PasswordRecover.aspx">Are you forgot password?</a>    
         </center>
        </div>
    </div>
0

The div tag that you want centered need to have a defined width, then set the margins to auto. I would surround your two divs that you want centered, give this new div a definite width (no percentages), then sit it's margins to auto.


OR if you're not concerned with deprecated tags or standards, the you can use <center></center> to center things, but this is NOT recommended because it will put IE into quirks mode, and things may misbehave in other browsers as well.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.