Web Parts in ASP.NET 3.5 - asp.net-3.5

I'm trying to create draggable web parts in ASP.NET 3.5 but the thing just doesn't want to be dragged. I already tried the workarounds for making it compatible with Firefox, by using AJAX, but still doesn't work.
This is code I have on my page:
<asp:WebPartManager ID="WebPartManager1" runat="server">
</asp:WebPartManager>
<uc2:DisplayModeMenu ID="DisplayModeMenu1" runat="server" />
<div>
<table>
<tr>
<td>
<asp:WebPartZone ID="SidebarZone" runat="server" HeaderText="Sidebar">
<ZoneTemplate>
<asp:Label runat="server" ID="linksPart" title="My Links">
ASP.NET site
<br />
GotDotNet
<br />
Contoso.com
<br />
</asp:Label>
<uc1:SearchUserControl ID="SearchUserControl1" runat="server" title="Search" />
</ZoneTemplate>
</asp:WebPartZone>
</td>
<td>
<asp:WebPartZone ID="MainZone" runat="server" HeaderText="Main">
<ZoneTemplate>
<asp:Label ID="lbl" Text="Some text" Title="Content" runat="server"></asp:Label>
</ZoneTemplate>
</asp:WebPartZone>
</td>
<td>
<asp:EditorZone ID="EditorZone1" runat="server">
<ZoneTemplate>
<asp:AppearanceEditorPart ID="AppearanceEditorPart1" runat="server" />
<asp:LayoutEditorPart ID="LayoutEditorPart1" runat="server" />
</ZoneTemplate>
</asp:EditorZone>
</td>
</tr>
</table>
</div>
I never get the drag cursor when I hover the titles.
Any idea on what I may be doing wrong?
EDIT:
I am in the page in Edit mode, not Browse mode....
Tks in advance.

As a reference, I solved the problem by adding a css to the div containing the web part controls:
<style type="text/css">
.container
{
padding: 0px;
margin-top: 5px;
margin-left: 20px;
margin-bottom: 0px;
/* position: relative; */
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #333333;
height: 550px;
width: 990px;
}
</style>
It has to do with the position element.
Hope it helps someone facing the same problem.

Related

Resources on how to prevent HTML email errors after it's replied to/forwarded

I'm working on an HTML email signature. It displays properly when you send it, but when a recipient replies to or forwards the email, the spacing gets messed up and there are some other problems.
Before (yay):
After (boo):
Here's the code that the signature is generated from:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled</title>
<!--[if !mso]><!-->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--<![endif]-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<!-- 569 when finalizing (don't include px sufix)-->
<table border-collapse="collapse" width="569" style="border-width: 0; font-family: 'Proxima Nova', Helvetica, Arial, Sans-serif; color: #303130;" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<!-- Image table -->
<table border-collapse="collapse" width="83px" align="left" border="0" cellspacing="0" cellpadding="0" style="border: #ffffff;">
<tr>
<td bgcolor="#ffffff" style="padding: 0px; font-family: 'Proxima Nova', Helvetica, Arial, Sans-serif;">
<p style="mso-table-lspace: 0; mso-tablerspace: 0; margin: 0;">
<!-- 1. Headshot image (src and alt) -->
<img src="http://www.levelfunded.com/email/russ_carpel.jpg" alt="Russ Carpel headshot" style="display: block;"/>
</p>
</td>
</tr>
</table>
<!-- Contact info table -->
<table border-collapse="collapse" width="329" height="72px" align="left" border="0" cellspacing="0" cellpadding="0" align="right" style="border:1px solid #ffffff;">
<tr>
<td bgcolor="#ffffff" style="padding: 0px; vertical-align: top; font-family: 'Proxima Nova', Helvetica, Arial, Sans-serif;">
<p style="mso-table-lspace: 0; mso-tablerspace: 0; margin: 0;">
<p style="font-size: 14px; margin: 0px; margin-top: 8px;">
<b>
<!-- 2. Name -->
<span>Russ Carpel</span>
</b>
<!-- 3. Title -->
<span style="font-size: 13px;">CEO</span>
</p>
<p style="font-size: 14px; margin: 0px; margin-top: 5px;">
<!-- 4. Mobile number (href and copy) -->
<span>(888) 888-8888 m</span>
<span style="color: #bababa;"> | </span>
<!-- 5. Email (href and copy) -->
<span>
address#domain.com
</span>
<span>
<!-- 6. LinkedIn profile -->
<a href="https://www.linkedin.com/in/profile" target="_blank">
<img src="http://levelfunded.com/email/linkedIn.jpg" alt="LinkedIn" style="vertical-align: top; margin-top: 1px"/>
</a>
</span>
</p>
<p style="font-size: 14px; margin: 0px; margin-top: 5px;">
<!-- 7. Office number -->
<span>(888) 888-8888 o</span>
<span style="color: #bababa;"> | </span>
<span>levelfunded.com</span>
</p>
</p>
</td>
</tr>
</table>
<!-- Logo table -->
<table border-collapse="collapse" width="107" height="72px" align="left" border="0" cellspacing="0" cellpadding="0" style="border:1px solid #ffffff;">
<tr>
<td bgcolor="#ffffff" valign="bottom" style="font-family: 'Proxima Nova', Helvetica, Arial, Sans-serif;">
<p style="mso-table-lspace: 0; mso-tablerspace: 0; margin: 0;">
<a href="http://levelfunded.com" target="_blank">
<img src="http://levelfunded.com/email/levelfundedLogoCities.jpg" alt="LevelFunded Logo"/ style="display: block;">
</a>
</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="3">
<!-- Speech carrot table -->
<table border-collapse="collapse" align="left" border="0" cellspacing="0" cellpadding="0" style="font-family: 'Proxima Nova', Helvetica, Arial, Sans-serif; color: #303130; padding-top: 10px; padding-left: 22px; border-width: 0;">
<tr>
<td>
<img src="http://www.levelfunded.com/email/triangle.jpg" alt="Speech carrot" style="display: block;"/>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<!-- Gray box cell -->
<td colspan="3" style="padding-left: 8px; padding-top: 8px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-color: #e8e8e8;">
<!-- Video link table -->
<table border-collapse="collapse" align="left" border="0" cellspacing="0" cellpadding="0" style="font-family: 'Proxima Nova', Helvetica, Arial, Sans-serif; color: #303130; padding-bottom: 8px; padding-right: 8px; border:1px solid #e8e8e8;">
<tr>
<td bgcolor="#e8e8e8" style="font-family: 'Proxima Nova', Helvetica, Arial, Sans-serif;">
<p style="mso-table-lspace: 0; mso-tablerspace: 0; margin: 0;">
<a href="http://levelfunded.com/video.html">
<img src="http://levelfunded.com/email/videoLinkImg-trimmed.jpg" alt="Immediately reduce health benefits costs by $50K, possibly $250K or more. Click to watch video." style="display: block; padding: 0px; margin: 0px;"/>
</a>
</p>
</td>
</tr>
</table>
<!-- Article link table -->
<table border-collapse="collapse" align="left" border="0" cellspacing="0" cellpadding="0" style="font-family: 'Proxima Nova', Helvetica, Arial, Sans-serif; color: #303130; padding-bottom: 8px; padding-right: 8px; border:1px solid #e8e8e8;">
<tr>
<td bgcolor="#e8e8e8" style="font-family: 'Proxima Nova', Helvetica, Arial, Sans-serif;">
<p style="mso-table-lspace: 0; mso-tablerspace: 0; margin: 0;">
<a href="http://www.chicagotribune.com/business/ct-small-business-insurance-1214-biz-20141214-story.html">
<img src="http://levelfunded.com/email/articleLinkImg-trimmed.jpg" alt="Click to read Chicage Tribune article" style="display: block;"/>
</a>
</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="3">
<table border-collapse="collapse" align="left" border="0" cellspacing="0" cellpadding="8" style="font-family: 'Proxima Nova', Helvetica, Arial, Sans-serif; color: #7e7e7e; font-size: 10px; line-height: 12px; border-width: 0;">
<tr>
<td>
This email is confidential communication from Level Funded Health Partners LLC and may not be forwarded without the expressed written consent of the company. Level Funded Health Partners LLC is a DE LLC, File #8888888. The company is a U.S. based licensed insurance agency entity. Delaware insurance agency entity license #8888888.
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
I understand that when the recipient composes and sends their reply, their email client has to re-encode the email and that creates the possibility for these formatting errors. (More on that here.)
To be clear, here are the errors I'm talking about:
Extra space above and below the speech carrot graphic
Link formatting is lost (on the blurred section, but you can see that the green is turning into blue
The background color on the gray rectangle is getting dropped
Padding on the two big graphics is getting decreased
Font styling on the disclaimer text is getting dropped
Disclaimer copy is getting truncated after the second # character.
I know trying to answer all of that is too broad. So here's my question:
I've found lots of resources for coding a good html email. However, I haven't been able to find resources on good practices to make it more resilient against these kinds of errors when it is replied to or forwarded. Can anybody point me to any such resources?
Unfortunately you can't account for all of the different email clients out there with regards to email forwarding. They all handle them differently. You can almost certainly count on your HTML formatting being somehow broken when someone forwards an email to someone else with the forward button. (You can do your best though; I commented earlier with some suggestions.)
The alternative is to use a "Forward to a friend" functionality available in some email service providers such as Salesforce (formerly ExactTarget) for example. You would encourage people to click on a link which would take the user to a page to fill in an email address, then the message would be sent to them on the user's behalf. In ET you could also show/hide certain information depending on the context. So, if someone was sending the message via FTAF, any sensitive information could be removed, for example. This all of course depends on your email service provider's offerings.

Html table cells not responsive on iphone emails

I'm setting up an html template for a client so having fun with tables, yay.
Responsiveness previews correctly in desktop browser, but when sent to an iphone, the td's are not scaling with the percentage applied, just defaulting to content size. The example I've supplied is for images (trying to setup a nav for the template), but also applies to text only as well.
The goal is a 600px centered content area with the background of the email a light gray. Under 600px, the nav cells should responsively scale to 25% of the viewport, but with text content the cells shrink to text size, and images they expand to image size.
Anyone know a way on iphones to set table cell widths as a percentage of the viewport?
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1 user-scalable=no">
<style>
.wrapper {
width: 100%;
text-align: center;
background-color: #ebebeb;
}
.container {
width: 600px;
max-width: 600px;
margin: auto;
}
.header {
background-color: #ffffff;
width: 100%;
}
#media (max-width: 600px) {
html, body, .wrapper, .container, .header, .wrapper-td, .container-td {
width: 100% !important;
max-width: 100% !important;
}
}
</style>
</head>
<body>
<table class="wrapper">
<tr>
<td class="wrapper-td">
<table class="container">
<tr>
<td class="container-td">
<table class="header">
<tr>
<td style="width: 25%;">
<img src="http://s9.postimg.org/a3mogw58b/nav_membership.jpg" style="width: 100%;" />
</td>
<td style="width: 25%;">
<img src="http://s9.postimg.org/a3mogw58b/nav_membership.jpg" style="width: 100%;" />
</td>
<td style="width: 25%;">
<img src="http://s9.postimg.org/a3mogw58b/nav_membership.jpg" style="width: 100%;" />
</td>
<td style="width: 25%;">
<img src="http://s9.postimg.org/a3mogw58b/nav_membership.jpg" style="width: 100%;" />
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Try to add html, body{margin:0; padding:0} to the style, and cellpadding="0" cellspacing="0" to all your tables.
Codepen: http://codepen.io/Bidstrup/pen/LVobpG

export <td> with two lines to pdf using itextsharp

I am having trouble exporting to pdf if I have a two lines in a td. Can you please advise. the code is as follows:
.style7
{
font-weight: bold;
display:block;
}
.style8
{
font-size: smaller;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Panel ID="pnlPerson" runat="server" style="margin-right: 3px" Width="1045px">
<div class="style3"><strong>MAINTENANCE ENGINEERING CALL (MEC)</strong></div>
<table border="1"
style="font-family: Arial; font-size: 10pt; width: 1048px; height: 390px;">
<tr>
<td><span class="style7">Shop Submittal Date</span>
<span="style8"><asp:TextBox ID="Sdate" runat="server"></asp:TextBox></span>
</td>
</tr>
Thank you so much.

how to use updatepanel in repeater?

I have to use updatepanel in repeater. When I change values in textbox, I want to see change eval("fiyat") values without postback.
<asp:ScriptManager ID="gel" runat="server"></asp:ScriptManager>
<asp:Repeater ID="tum_sepet" runat="server" OnItemCreated="tum_sepet_ItemCreated">
<ItemTemplate>
<tr>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<td style="width: 147px; vertical-align: top; text-align: center; border-bottom: 2px solid #dbdbdb;">
<div class="ok_sepet_urun_fiyat"><%# Convert.ToDecimal ( Eval("fiyat")).ToString("#,##0.00") %> <%# Eval("parabirim") %></div>
</td>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="TextBox1" />
</Triggers>
</asp:UpdatePanel>
</tr>
</ItemTemplate>
</asp:Repeater>
Code
protected void tum_sepet_ItemCreated(object sender, RepeaterItemEventArgs e)
{
var control = e.Item.FindControl("TextBox1");
ScriptManager.GetCurrent(Page).RegisterAsyncPostBackControl(control);
}
I make this process in .cs eval("fiyat") = price * number(TextBox1.Text).
Any Ideas ?

center align email in outlook.com

I have created a very simple html email.
http://staging.xhtml-lab.com/mailtest/
It's working fine in all email clients, except in hotmail.com/outlook.com
in hotmail email is left aligned, it should remain center aligned.
I have added following code as suggested by emailology.org, but it have no effect.
<style type=“text/css”>
/**This is to overwrite Hotmail’s Embedded CSS************/
table {border-collapse:separate;}
a, a:link, a:visited {text-decoration: none; color: #00788a}
a:hover {text-decoration: underline;}
h2,h2 a,h2 a:visited,h3,h3 a,h3 a:visited,h4,h5,h6,.t_cht {color:#000 !important}
p {margin-bottom: 0}
.ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td {line-height: 100%}
/**This is to center your email in Hotmail************/
.ExternalClass {width: 100%;}
</style>
Any suggestions for what else i can do to make the email center aligned?
This should give you a centered e-mail:
<table style="width: 100%; background: red;">
<tr>
<td>
<center>
<table style="width: 640px; background: blue; margin: 0 auto; text-align: left;">
<tr>
<td>
Your content here
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
The center-tag is what is required by Outlook and outlook.com. Other clients use the margin attribute. In some clients, text is centered after the center-tag, and therefore the text-align attribute is required.
If you want the width to be variable depending on the screen size, use the following code:
<table style="width: 100%; background: red;">
<tr>
<td>
<center>
<!--[if mso]>
<table style="width: 640px;"><tr><td>
<![endif]-->
<div style="max-width: 800px; margin: 0 auto;">
<table style="background: blue; text-align: left;">
<tr>
<td>
Your content here
</td>
</tr>
</table>
</div>
</center>
<!--[if mso]>
</td></tr></table>
<![endif]-->
</td>
</tr>
</table>
Outlook does not support max-width, and therefore the size is fixed to 640px for Outlook. For all other clients, the width of the e-mail will be the same as that of the viewing window, but maximum 800px.
Please let me know if you find a client where these solutions does not work, so that we can find a solution that works with as many clients as possible.
Here is one I've built that I use as the starting point for all my emails. It works 100% on all major email clients:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title></title></head>
<body style="margin: 0px; padding: 0px background-color: #FFFFFF;" bgcolor="#FFFFFF"><!-- << bg color for forwarding (leave white) // main bg color >> --><table bgcolor="#252525" width="100%" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td>
<!-- CENTER FLOAT WIDTH -->
<table width="600" border="0" valign="top" align="center" cellpadding="0" cellspacing="0"><tr><td><!-- Master Width of the center panel -->
preheader...
<!-- CENTER PANEL BG COLOR (to hide separation of tables on email forward from Outlook (known issue) -->
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF"><tr><td><!-- Master Color of the center panel -->
content...
<!-- /CENTER BG COLOR -->
</td></tr></table>
<!-- /CENTER FLOAT WIDTH -->
</td></tr></table>
<!-- /CENTER FLOAT -->
</td></tr></table></body></html>
It has a built in white background for when someone forwards the email on (they can type on white, while the background for the html designed part remains colored). Also the main panel is set with a bgcolor because Outlook puts gaps between tables when it is forwarded.
Hope that helps.
You can also center your email template by adding align="center"to your main table tag:
<body>
<table align="center">
<tr>
<td style="width:600px;">
<!-- content -->
</td>
</tr>
</table>
</body>
Works with GMail and Outlook
<body style="width:600px;margin: auto;">
<!-- content -->
</body>