Centering contentplaceholders

Posted by gh9 on Stack Overflow See other posts from Stack Overflow or by gh9
Published on 2011-01-02T20:25:46Z Indexed on 2011/01/02 20:54 UTC
Read the original article Hit count: 233

Filed under:
|
|

I have a contentplaceholder which needs to be centered (as close to absolute as possible) to the center of the page. The issue I am having is when, the browser moves to different resolutions the centering is thrown off.

I have tried using divs and tables. I have switched out the precent with em units, and still no workie. Any help would be greatly appreciated. My end goal is to have the contentplaceholder always be in the center of page regardless of the resolution of the monitor

    <div style="width:20%"/>
<div style="width:60">
contentplaceholercode
</div>
<div style="width:20%"/>


<table>
<tr >
<td style="width:20%">
</td>
<td style="width:60>
</td>
<td style="width:20%">
</td>
</tr>
</table>

code for master and code for content page

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Master.master.cs" Inherits="WorkRecordr.Master" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

    <script src="Assets/Scripts/Jqeury1.4.4.js" type="text/javascript"></script>

    <title></title>
    <style type="text/css">
        body
        {
            background-color: #326598;
        }
        .outer
        {
            width: 100%;
            border: solid 1px gray;
            padding: 1px;
        }
        .inner
        {
            border: solid 1px gray;
            width: 70%;
            margin-left: auto;
            margin-right: auto;
        }
    </style>
</head>
<body>
    <div style="text-align: center">
        <asp:ContentPlaceHolder ID="head" runat="server">

        </asp:ContentPlaceHolder>
    </div>
    <form id="form1" runat="server">
    <div class="outer">
    <div class="inner">
          <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
        </div>
    </div>

    </form>
</body>
</html>





<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="WorkRecordr.test" MasterPageFile="~/Master.Master" %>


<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
aaaaaaaaa***aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa***aaaaaaaaaaaaaaaa

</asp:Content>

© Stack Overflow or respective owner

Related posts about .NET

Related posts about css