• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 261
  • Last Modified:

How can I have content in a table cell centered?

Hi, I'm using asp.net 3.5
Attached is screen shot with cell outlined in browser and the rendered html page source.  i would like to center these 2 charts in their cells.  How to do that  Thank you.
td-center.jpg
BiweeklyResponse.html
BiWeeklyResponse.aspx
0
lapucca
Asked:
lapucca
1 Solution
 
Jerry MillerCommented:
Use the"text-align:center;" property for the cell.

http://www.w3schools.com/css/css_table.asp
0
 
Carlos VillegasFull Stack .NET DeveloperCommented:
This is your aspx page fixed, using the style "text-align:center" for both cells:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="BiWeeklyResponse.aspx.cs" Inherits="BiWeeklyResponse" %>

<%@ Register Assembly="System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI.DataVisualization.Charting" TagPrefix="asp" %>

<%@ Register Assembly="CrystalDecisions.Web, Version=10.5.3700.0, Culture=neutral, PublicKeyToken=692fbea5521e1304"
    Namespace="CrystalDecisions.Web" TagPrefix="CR" %>

<!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">
    <title>Adapt Study Biweekly Progress</title>
    
    <style type="text/css">
        * {margin:3px auto;padding:3px;}
        div.centerer{ width:100%; margin: 0 auto;} 
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div class="centerer">
    <table id="tblChart" runat="server">
     <tbody>
    <tr><td align="left" colspan="3"><p style="font-size:medium;">You are doing a great job getting to both of your goals. Keep it up! Take a look at the graphs to see how you are doing on your goals as compared to other people like you in the study.
<br /></p></td></tr>     
<%--    <tr><td align="center" colspan="3"><p style="font-size:x-large;">Adapt Study Progress Report</p></td></tr>
--%>   
    <tr><td style="width:48%; text-align: center;">
            <asp:Chart ID="Chart1" runat="server" BorderlineDashStyle="Solid" 
                BackGradientStyle="TopBottom" BackColor="#CCCCCC" Height="435px" Width="450px">
			    <titles>
				    <asp:Title ShadowColor="32, 0, 0, 0" Font="Trebuchet MS, 14.25pt, style=Bold" ShadowOffset="3" 
				       Name="Title1" ForeColor="26, 59, 105"></asp:Title>
			    </titles>
                <Legends>
                    <asp:Legend Docking="Bottom" IsDockedInsideChartArea="False" LegendStyle="Row" IsEquallySpacedItems="False"></asp:Legend>
                </Legends>
                <Series>
                    <asp:Series Name="Your Goal" ChartType="Column" CustomProperties="DrawingStyle=Cylinder" Color="#FFCC66">                
                    </asp:Series>
                    <asp:Series Name="Your Current Level" CustomProperties="DrawingStyle=Cylinder" Color="#99FF66"></asp:Series>
                    <asp:Series Name="Other ADAPT Participants" CustomProperties="DrawingStyle=Cylinder" Color="#0066FF"></asp:Series>                
                </Series>
                <ChartAreas>
                    <asp:ChartArea Name="ChartArea1" BackGradientStyle="TopBottom" BackColor="#FFFF99">
                    <AxisX IsMarginVisible="False" IsMarksNextToAxis="False" IsLabelAutoFit="False" LabelAutoFitStyle="None"> <MajorGrid Enabled="false" /></AxisX>
                    </asp:ChartArea>
                </ChartAreas>
            </asp:Chart>
        </td>
        <td style="width:4%;"><br/></td>
        <td style="width:48%; text-align: center;">
            <asp:Chart ID="chartWeeklyProgress" runat="server" BackGradientStyle="TopBottom" BackColor="#CCCCCC" Height="435px" Width="450px" BorderlineDashStyle="Solid">
                <titles>
				    <asp:Title ShadowColor="32, 0, 0, 0" Font="Trebuchet MS, 14.25pt, style=Bold" ShadowOffset="3" 
				       Name="WeeklyProgress" Text="Weekly Progress" ForeColor="26, 59, 105"></asp:Title>
                </titles>
                <Legends>
                    <asp:Legend Docking="Bottom" IsDockedInsideChartArea="False" LegendStyle="Row" IsEquallySpacedItems="False" Font="Microsoft Sans Serif, 8pt"></asp:Legend>
                </Legends>
                <Series>
                    <asp:Series Name="Your Progress" ChartType="Line">                    
                    </asp:Series>
                    <asp:Series Name="Goal" ChartType="Line">                    
                    </asp:Series>
                    
                </Series>
                <ChartAreas>
                    <asp:ChartArea Name="ChartArea1" BackGradientStyle="TopBottom" BackColor="#FFFF99">
                    <AxisX IntervalOffsetType="Auto" IntervalType="Weeks" Interval="1"> <MajorGrid Enabled="false" /></AxisX>
                    </asp:ChartArea>
                </ChartAreas>                
            </asp:Chart>        
        </td>
    </tr>
    </tbody></table>
    </div>
    </form>
</body>
</html>

Open in new window

0
 
lapuccaAuthor Commented:
Yap, that worked!  I thought TextAlign is only for text, haha.
0

Featured Post

How to Use the Help Bell

Need to boost the visibility of your question for solutions? Use the Experts Exchange Help Bell to confirm priority levels and contact subject-matter experts for question attention.  Check out this how-to article for more information.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now