is there any way you can send an email from c# asp.net with a html page with css.
Currently I am sending the email but when I open in gmail it does not capture the css included in the htmlpage
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
body{
background-color:navy;
color:white;
font-family:Menulis;
margin-left:40px;
}
div {
margin:0 auto;
}
img{
border-radius:5px;
width:200px;
height:300px;
margin-right:200px;
display:block;
float:right;
}
</style>
</head>
<body>
<div>
<h1>User {user_email} Error Report</h1>
<p>The following error occured when user is trying to reset password
from pswrd_recover.aspx page:</p><br/>
<img src="https://pcappliancerepair.files.wordpress.com/2016/11
/38644550_m.jpg?w=585"/>
<p>{error_message}</p>
</div>
</body>
</html>
Gmail removes the entire head portion of your email’s HTML. So, it will also remove any style elements.
You need to inline your CSS, like this:
<body style="background-color:navy; color:white;font-family:Menulis;margin-left:40px;">
<div style="margin:0 auto;">...</div>
<img style="border-radius:5px;width:200px;height:300px;margin-right:200px;display:block;float:right;" src="https://..." />
</body>
Related
I am trying to write text to the background of a blazor application.
I want it to show all my method calls in the background (so it looks techy!)
Does anyone know the best way to do this? I have researched but found nothing as of yet.
On the HTML/CSS side, it should be something along these lines:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style>
#content{
position: absolute;
top: 0%;
left: 0%;
font-size: 50px;
color: black;
-ms-transform: translate(-50%,-50%);
}
#background{
color: darkgray;
}
</style>
</head>
<body>
<div id="background">
This is my<br/>
background<br/>
content ...<br />
</div>
<div id="content">
This is my overlay content.
</div>
</body>
</html>
Two content blocks are created with the div tags: one for the foreground and one for the background. JavaScript can then be used to animate/adjust the background content accordingly to get your required effect.
Suppose I'm opening email details in a ASP.Net .aspx page div control. The problem is when I'm opening an email details containing html tag the page is showing messed up. Only the inner html contents are showing on the page. Is there any way I could solve this problem.
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<form >
<!-- Outer HTML contents... -->
<div id="dvViewMailReadOnly" style="overflow:auto; width:100%;height:auto;">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<img src="http://click.email.skype...>
</body>
</html>
</div>
</form>
</body>
</html>
The email contents are showing on dvViewMailReadOnly dynamically.
I'm still not sure I understand the problem. Yes, the HTML is invalid, as there must only be one <html> element (and consequently also only one <head> and <body> element).
If you are allowed to modify your form, then you could simply do this:
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<form >
<!-- Outer HTML contents... -->
<div id="dvViewMailReadOnly" style="overflow:auto; width:100%;height:auto;">
<img src="http://click.email.skype...">
</div>
</form>
</body>
</html>
Replace < by < and > by >
Using ASP.NET, C#, HTML5 and CSS3. My MasterPage is not recognizing the background image I have set in my stylesheet. I found an answer from 2009 on the ASP.NET forums from an MSN developer and it is still not working. After checking the code, the answer is relevant to XHTML transitional, the default doctype for .NET in Visual Studio.
Any suggestions? Thank you in advance.
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<link href="../changes.css" rel="stylesheet" type="text/css" />
<link href="../style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div id="PageWrapper">
html, body {
background-color: #000;
background-image: url('../images/darker_wood_1600x1200.jpg');
background-attachment: scroll;
background-repeat: repeat-x;
}
<!DOCTYPE html>
<html>
<meta charset="utf-8" />
<head><title>
</title>
<link href="changes.css" rel="stylesheet" type="text/css" /><link href="style.css" rel="stylesheet" type="text/css" /></head>
<body>
<form method="post" action="Default.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTY1NDU2MTA1MmRkM1MGX8QufJ31wnSeINevDB81G3lHsitto4ucLAdg6zs=" />
</div>
<div id="PageWrapper">
<div id="Header"><a href="./">Header here
</a></div>
<div id="MenuWrapper">Menu here</div>
<div id="MainContent">
</div>
<div id="Sidebar">Sidebar here</div>
<div id="Footer">Footer here</div>
</div>
</form>
This code works for me, but I don't know if the code above is how it looks. Cause you post a stylesheet value in the middle of a div.
Also, if the page can't read the file. Try a different file or try changing the search path for the file. Maybe it can't read it because it's outside the server dir. Because the CSS code looks correct.
<!DOCTYPE html>
<html>
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<link href="../changes.css" rel="stylesheet" type="text/css" />
<link href="../style.css" rel="stylesheet" type="text/css" />
<link href="changes.css" rel="stylesheet" type="text/css" /><link href="style.css" rel="stylesheet" type="text/css" /></head>
<meta charset="utf-8" />
<style type="text/css">
// If you want the "Page" background to be this way:
html, body
{
background-color: #000;
background-image: url('../images/darker_wood_1600x1200.jpg');
background-attachment: scroll;
background-repeat: repeat-x;
}
// Or the PageWrapper
div#PageWrapper
{
background-color: #000;
background-image: url('../images/darker_wood_1600x1200.jpg');
background-attachment: scroll;
background-repeat: repeat-x;
}
</style>
</head>
<body>
<!--- <form id="form1" runat="server"> --->
<form method="post" action="Default.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTY1NDU2MTA1MmRkM1MGX8QufJ31wnSeINevDB81G3lHsitto4ucLAdg6zs=" />
</div>
<div id="PageWrapper">
<div id="Header">
Header here
</div>
<div id="MenuWrapper">
Menu here
</div>
<div id="MainContent">
</div>
<div id="Sidebar">
Sidebar here
</div>
<div id="Footer">
Footer here
</div>
</div>
</form>
<!--- </form> --->
</body>
</html>
Is there a way to read the style attribute of body inside an iFrame?
I've tried using multiple combinations of Body, NativeElement, Frame and other Properties, but so far I had no luck.
<iframe id="iFrame" width="100%" height="500" frameborder="0" src="some source">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body style="margin: 0px; padding: 0px;height:500px;">
</body>
</html>
</iframe>
Example:
_browser.Frame(Find.ById(frameId)).Body.GetAttributeValue("style")
Iframe may be inside a different form, did you tried?
it happend once to me, the iframe was in a different form(nested form)
I want to replace all font-size-parameters in a html document (css attributes).
I'm using .net with c#.
I guess it could be done with some regular expression.
Am I forgetting some other ways to set the font size?
Example:
<html>
<head>
<style type="text/css">
.t {
font-size: large;
}
</style>
</head>
<body>
<span style="font-size: medium" />
</body>
</html>
into:
<html>
<head>
<style type="text/css">
.t {
font-size: large_replaced;
}
</style>
</head>
<body>
<span style="font-size: medium_replaced" />
</body>
</html>
if you use relative unit like em, ex etc for all font dimensions in your page. By adjusting
only html elements' size you manage all fonts
big fonts
html{
font-size:18px;
}
smaller fonts
html{
font-size:18px;
}
you can manage that form javascript, better (also using cookies).
I ended up using the following regex to find where to replace:
/style=\"[.]*font-size:(?<size>[^;]*);[^\"]*[\"]/
/<style[^<]*font-size:(?<size>[^;]*);[^<]*[<]/