Hello All,
I have been working on a project and i am facing some issues. Your help will be highly appreciated.
Issue:
I have a master page in which i have 2 content placeholder. for reference below is the complete code of the project file.
<%@ Page Title="" Language="C#" MasterPageFile="~/Visitor/VisitorPage.master" AutoEventWireup="true"
CodeFile="Home.aspx.cs" Inherits="Visitor_Home" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
<style type="text/css">
.style2
{
font-size: large;
}
</style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<h4>
Want to cook some exciting food?<br />
Welcome!
<br />
In this website you will get a wide range of Recipes ranging from
appetizers to desserts, traditional to international and much much more.<br />
Enjoy your everyday cooking with us.<br />
Find the best recipes, Egg Substitutes, party ideas and easy cooking
techniques all under one website.
<br />
Through this site, I would like to introduce recipes from all around
the world.
<br />
I always try recipes with different ingredients, so I come up with
many other indobase international recipes such as Indo-Italian, Indo-Mexican.<br />
<br />
I like modern cooking, but would love to keep originality to some
recipes.<br />
<br />
I would love to share recipes with you that will shake your taste
buds and make your everyday menu excited.
<br />
:) Keep in touch!! :)</h4><br />
<br />
<asp:Image ID="Image1" runat="server" Height="100px" Width="880px"
ImageUrl="~/Image/advertisement/tummyfoody40.gif" />
<br />
Till here i have no issue. the page output is exactly as i want.
After a user logins the below link is visible - Leave a comment
And the issue starts. The content of the link goes out of the frame and the background image. Please help me in understanding how to set the size to autoresize.
<asp:LinkButton ID="LinkButton1" runat="server" OnClick="LinkButton1_Click">Leave A Comment</asp:LinkButton>
<br />
<br />
<asp:Panel ID="Panel1" runat="server" Visible="false">
<h3 style="color: #000000">
Share Your Comments Regarding Website</h3>
<table cellpadding="4" cellspacing="4">
<tr>
<td class="style1">
UserName:
</td>
<td>
<asp:TextBox ID="txtName" runat="server" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style1">
Subject:
</td>
<td>
<asp:TextBox ID="txtSubject" runat="server" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style1">
Comments:
</td>
<td>
<asp:TextBox ID="txtComment" runat="server" Rows="5" Columns="20" TextMode="MultiLine"
Width="400px" Height="134px" />
</td>
</tr>
<tr>
<td colspan="2" align="center">
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
</td>
</tr>
</table>
<div>
<asp:Repeater ID="RepDetails" runat="server" >
<HeaderTemplate>
<table style="border: 1px solid #df5015; width: 500px" cellpadding="0">
<tr style="background-color: red; color: Black">
<td colspan="2">
<b>Your Comments Mean A Lot.</b>
</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: #ff9933">
<td>
<table style="background-color: #ff9966; border-top: 1px dotted #df5015; width: 500px">
<tr>
<td>
Subject:
<asp:Label ID="lblSubject" runat="server" Text='<%#Eval("Subject") %>' Font-Bold="true" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblComment" runat="server" Text='<%#Eval("Comment") %>' />
</td>
</tr>
<tr>
<td>
<table id="comment2" style="background-color: #99cc00; border-top: 1px dotted #df5015;
border-bottom: 1px solid #df5015; width: 500px">
<tr>
<td>
Post By:
<asp:Label ID="lblUser" runat="server" Font-Bold="true" Text='<%#Eval("UserName") %>' />
</td>
<td>
Created Date:<asp:Label ID="lblDate" runat="server" Font-Bold="true" Text='<%#Eval("PostedDate") %>' />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
</asp:Panel>
</asp:Content>
For reference below is the CSS code:
*
{
margin: 0;
padding: 0;
}
body
{
-webkit-user-select: none;
-moz-user-select: -moz-none;
-ms-user-select: none;
user-select: none;
font-family: Comic Sans MS,Lucida Handwriting;
color: #4b4b4b;
background-image:url(../Image/logo/IMG-20140403-WA0004.jpg);
background-repeat:no-repeat;
}
#wrapper
{
width: 1300px;
height:auto;
margin: 0 auto;
padding: 5px;
background-repeat: no-repeat;
border:3px solid;
border-color:#663300;
}
#navigation ul li
{
float: left;
list-style: none;
margin-right:0.2em;
font-family: Forte, helvetica, sans-serif;
font-size: 20px;
padding: 3px;
height:38px;
}
#navigation
{
margin: 0;
padding: 0;
border:2px solid;
border-color:#663300;
}
#navigation li a
{
color: #4b4b4b;
text-decoration: none;
float: left;
padding: 10px;
height: 10px;
}
#navigation li a:hover
{
color: #ff9900;
-webkit-transform: rotate(-10deg) scale(1.2);
-moz-transform: rotate(-10deg) scale(1.2);
-o-transform: rotate(-10deg) scale(1.2);
}
#content_area
{
margin: 20px 0 20px 0;
padding: 10px;
height:auto;
}
#footer ul li
{
float:right;
list-style: none;
margin-right: 1em;
font-family: Dead Hardy;
font-size: 10px;
padding: 5px;
height: 20px;
width: auto;
}
#footer
{
clear: both;
height: auto;
width: auto;
margin-top: 5px;
color: #4b4b4b;
text-align:center;
font-size:15px;
}
#footer li a
{
color: #4b4b4b;
text-decoration: none;
float: left;
padding: 3px;
height: 10px;
width: auto;
}
#footer li a:hover
{
color: #449900;
}