edge of the web page not going all the way over

Tom Knowlton
Tom Knowlton used Ask the Experts™
on
Please go to:

http://www.rettspringfling.com/

The purple column on the right hand side is supposed to be on the absolute right edge of the page.

The fields where you enter in the name and other information should be to the left of that purple column.


I have the whole thing in a table.

I will provide markup and code behind.


Tom
//MARKUP:

<%@ Page Title="" Language="C#" MasterPageFile="~/RSF.Master" AutoEventWireup="true"
    CodeBehind="default.aspx.cs" Inherits="RettSpringFling.defaulta" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <style type="text/css">
        .style3
        {
            color: #FF9900;
        }
        .style4
        {
            color: #7364FD;
        }
        .style5
        {
            font-size: smaller;
        }
        .style6
        {
            color: #FF6600;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <table style="width: 100%; height: 1000px;">
        <tr>
            <td rowspan="2" style="width: 10%;">
                <asp:Image ID="lefthandpurple" runat="server" ImageUrl="~/img/lefthandborder.jpg" /><asp:Image
                    ID="lefthandblacktowhite" runat="server" ImageUrl="~/img/lefthandblacktowhite.jpg" />
            </td>
            <td colspan="2" style="vertical-align: top; text-align: center; width: 80%">
                <asp:Image ID="RettSpringFlingMainBanner" runat="server" ImageAlign="Top" Height="188"
                    Width="381" ImageUrl="~/img/RettSpringFlingMainImage.png" />
            </td>
            <td rowspan="2" style="width: 10%;">
                <asp:Image ID="Image1" runat="server" ImageUrl="~/img/righthandblacktowhite.jpg" /><asp:Image
                    ID="Image2" runat="server" ImageUrl="~/img/righthandborder.jpg" />
            </td>
        </tr>
        <tr>
            <td style="width: 10%;">
            </td>
            <td style="vertical-align: top; width: 60%;">
                <p class="style1">
                    Come join us for a night in celebration of our Silent Angels! This year’s Spring
                    Fling will be held May 1, 2010 at The Kauri Sue Hamilton School located at 2827
                    West 13400 South, Riverton Utah from 6:00-10:00 PM. All proceeds will go to the
                    Rett Syndrome Research Trust to continue their research.</p>
                <p class="style1">
                    In 2007, Dr. Adrian P. Bird, the world's leading expert in the gene, MECP2 successfully
                    reversed symptoms of this devastating disorder in a mouse model. Therapeutic approaches
                    are now being considered. Our girls need your help, now more than ever, to aggressively
                    pursue treatments. Together we can make a difference.</p>
                <p class="style1">
                    Dinner will be served from 6:00 until 7:30 PM. The Flashback Brothers will be entertaining
                    us with great dance music from the 50’s through the 80’s beginning at 6:30 PM. Silent
                    auction items and door prizes will be running all night with winners to be announced
                    at 9:00 PM. A list of items up for auction will be posted soon. Tickets are a reasonable
                    $25. Tickets will be emailed for you to print out.</p>
                <p class="style1">
                    Any questions, comments, or to help sponsor this event/auction, please contact Syndi
                    Knowlton at (801) 770-2810 or email her at <a href="mailto:Syndi@spatzgear.com">Syndi@spatzgear.com</a></p>
                <asp:Image ID="FlashbackBros" runat="server" Width="200" Height="175" ImageUrl="~/img/FBBros.png" />
                <asp:Image ID="SandyKitchen" runat="server" Height="175" ImageUrl="~/img/sandykitchenlogo.jpg" />
            </td>
            <td style="width: 20%;">
                FOR TICKETS:<br />
                Name:<br />
                <asp:TextBox ID="TextBoxName" runat="server" CssClass="style4" BackColor="#CCCCFF"
                    Font-Bold="True" ForeColor="Black" Width="180"></asp:TextBox><br />
                Business:(if applicable)
                <asp:TextBox ID="TextBoxBusiness" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Address:
                <asp:TextBox ID="TextBoxAddress" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                City:
                <asp:TextBox ID="TextBoxCity" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                State:
                <asp:TextBox ID="TextBoxState" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Zip:
                <asp:TextBox ID="TextBoxZip" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Email:
                <asp:TextBox ID="TextBoxEmail" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Phone:
                <asp:TextBox ID="TextBoxPhone" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Fax:
                <asp:TextBox ID="TextBoxFax" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Tickets: ($25 per person) # of people attending:&nbsp;&nbsp;<asp:TextBox ID="TextBoxTickets"
                    runat="server" Width="25" BackColor="#FFCC00" Font-Bold="True"></asp:TextBox>
                <asp:Button ID="ButtonBuyNow" runat="server" Width="185px" Text="Buy Now!" BackColor="#CC0000"
                    Font-Names="Aharoni" Font-Size="Larger" ForeColor="White" Height="37px" OnClick="ButtonBuyNow_Click" />
            </td>
            <td style="width: 10%;">
            </td>
        </tr>
    </table>
</asp:Content>









//CODE:BEHIND:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace RettSpringFling
{
    public partial class defaulta : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void ButtonBuyNow_Click(object sender, EventArgs e)
        {
            SendDetailsToSpatzgear();

            System.Threading.Thread.Sleep(5000);

            string grandtotal = Convert.ToString(Convert.ToInt32(this.TextBoxTickets.Text) * 25);
            string paypalurl = "https://www.paypal.com/cgi-bin/webscr?cmd=_xclick&business=syndi@spatzgear.com&item_name='Rett Spring Fling'&currency_code=USD&amount=" + grandtotal;
            Response.Redirect(paypalurl);
        }

        private void SendDetailsToSpatzgear()
        {
            EmailSupport es = new EmailSupport();

            string attachment = "";

            string message = "\n\nName:  " + this.TextBoxName.Text +
                "\n\nBusiness:  " + this.TextBoxBusiness.Text +
                "\n\nAddress:  " + this.TextBoxAddress.Text +
                "\n\nCity:  " + this.TextBoxCity.Text +
                "\n\nState:  " + this.TextBoxState.Text +
                "\n\nZip:  " + this.TextBoxZip.Text +
                "\n\nPhone:  " + this.TextBoxPhone.Text +
                "\n\nFax:  " + this.TextBoxFax.Text +
                "\n\nEmail:  " + this.TextBoxEmail.Text +
                "\n\nNumber of tickets:  " + this.TextBoxTickets.Text;
            try
            {
                es.SendEmail(this.TextBoxEmail.Text, "syndi@spatzgear.com", "Rett Spring Fling TICKET PURCHASE!", message, attachment, "relay-hosting.secureserver.net");
            }
            catch (System.ArgumentNullException eee)
            {
                Response.Write("SPATZGEAR ERROR:  " + "\n\n\n" + eee.Message.ToString());
            }

        }
    }
}

Open in new window

Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®

Commented:
For us to be able to answer why this is not working you would also need to provide the master page markup. The Table width of 100% really only matters based on the width of it's parent container.

Thanks!

Commented:
You need to modify your html to look like this.

 This is just the table within.

You will then need to modify the side bar image to be wider than the textboxes so that it doesn't show up more than once.

One last thing, on the master page, set the <body> tag like this....

<body style="margin:0px;"
<table style="width: 100%; height: 1000px; border-collapse:collapse;" cellpadding="0">
        <tr>
            <td rowspan="2" style="width: 10%;">
                <asp:Image ID="lefthandpurple" runat="server" ImageUrl="~/img/lefthandborder.jpg" /><asp:Image
                    ID="lefthandblacktowhite" runat="server" ImageUrl="~/img/lefthandblacktowhite.jpg" />
            </td>
            <td style="vertical-align: top; text-align: center; width: 80%">
                <asp:Image ID="RettSpringFlingMainBanner" runat="server" ImageAlign="Top" Height="188"
                    Width="381" ImageUrl="~/img/RettSpringFlingMainImage.png" />
            </td>
            <td rowspan="2" style="width: 10%; background-image:url('img/righthandborder.jpg');">                
                FOR TICKETS:<br />
                Name:<br />
                <asp:TextBox ID="TextBoxName" runat="server" CssClass="style4" BackColor="#CCCCFF"
                    Font-Bold="True" ForeColor="Black" Width="180"></asp:TextBox><br />
                Business:(if applicable)
                <asp:TextBox ID="TextBoxBusiness" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Address:
                <asp:TextBox ID="TextBoxAddress" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                City:
                <asp:TextBox ID="TextBoxCity" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                State:
                <asp:TextBox ID="TextBoxState" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Zip:
                <asp:TextBox ID="TextBoxZip" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Email:
                <asp:TextBox ID="TextBoxEmail" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Phone:
                <asp:TextBox ID="TextBoxPhone" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Fax:
                <asp:TextBox ID="TextBoxFax" runat="server" BackColor="#CCCCFF" Font-Bold="True"
                    Width="180"></asp:TextBox>
                Tickets: ($25 per person) # of people attending:&nbsp;&nbsp;<asp:TextBox ID="TextBoxTickets"
                    runat="server" Width="25" BackColor="#FFCC00" Font-Bold="True"></asp:TextBox>
                <asp:Button ID="ButtonBuyNow" runat="server" Width="185px" Text="Buy Now!" BackColor="#CC0000"
                    Font-Names="Aharoni" Font-Size="Larger" ForeColor="White" Height="37px" />
            </td>
        </tr>
        <tr>
            <td style="vertical-align: top; width: 80%;">
                <p class="style1">
                    Come join us for a night in celebration of our Silent Angels! This year’s Spring
                    Fling will be held May 1, 2010 at The Kauri Sue Hamilton School located at 2827
                    West 13400 South, Riverton Utah from 6:00-10:00 PM. All proceeds will go to the
                    Rett Syndrome Research Trust to continue their research.</p>
                <p class="style1">
                    In 2007, Dr. Adrian P. Bird, the world's leading expert in the gene, MECP2 successfully
                    reversed symptoms of this devastating disorder in a mouse model. Therapeutic approaches
                    are now being considered. Our girls need your help, now more than ever, to aggressively
                    pursue treatments. Together we can make a difference.</p>
                <p class="style1">
                    Dinner will be served from 6:00 until 7:30 PM. The Flashback Brothers will be entertaining
                    us with great dance music from the 50’s through the 80’s beginning at 6:30 PM. Silent
                    auction items and door prizes will be running all night with winners to be announced
                    at 9:00 PM. A list of items up for auction will be posted soon. Tickets are a reasonable
                    $25. Tickets will be emailed for you to print out.</p>
                <p class="style1">
                    Any questions, comments, or to help sponsor this event/auction, please contact Syndi
                    Knowlton at (801) 770-2810 or email her at <a href="mailto:Syndi@spatzgear.com">Syndi@spatzgear.com</a></p>
                <asp:Image ID="FlashbackBros" runat="server" Width="200" Height="175" ImageUrl="~/img/FBBros.png" />
                <asp:Image ID="SandyKitchen" runat="server" Height="175" ImageUrl="~/img/sandykitchenlogo.jpg" />
            </td>
            <td style="width: 20%;">
                
            </td>            
        </tr>
    </table>

Open in new window

Commented:
actually, main source of the problem seems to be the <td style="width: 10%;">
            </td>

in the second <tr> element.

if you remove that you should get the effect you're looking for.
Tom KnowltonWeb developer

Author

Commented:
Master Page markup:
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="RSF.master.cs" Inherits="RettSpringFling.RSF" %>

<!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></title>
    <style type="text/css">
        .style1
        {
            font-family: Eras Medium ITC;
            font-size: larger;
            text-align: left;
        }
        .style2
        {
            height: 11px;
        }
    </style>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        
        </asp:ContentPlaceHolder>
    </div>
    </form>
   
   <script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-10073099-2");
pageTracker._trackPageview();
} catch(err) {}</script></body>
</html>

Open in new window

Commented:
Like i said in the post above your last, your problem is that you have the td width 10% in the second row, when in the first row you have defined the first column to have a rowspan of 2. This is why your page is turning out messed up! This will fix your issue.

Have a great day!

Josh

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial