The CSS of my email form just wont work atfer it goes in the Email Template, I paste it into the html box, everything looks good for a "moment" in the wysiwyg window then my form looks plain. I've sent myself the form too.
I've got Chrono Contact 3.0 Stable.
Chrono Contact 2.5 V2.5_J1.5_RC3.1 was fine with my same code.
Here's how it looks in the Email Template creator after I paste it in.
<!-- #holder { width:900px; text-align:left; margin:0 auto; } body { font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-align: center; } .form_elements_center { margin:20px; text-align:center; } .form_elements { margin:20px; } .form_content { margin:5px; } .form_content_center { margin:5px; text-align:center; } input, textarea, select { font-family:Arial, Helvetica, sans-serif; } table { font-family: Arial, Helvetica, sans-serif; font-size: 12px; } fieldset { position:relative; background:#dbe3c5; padding-top:20px; } legend { color:#FFFFFF; font-size:12px; position:absolute; top:-10px; background:#7E8961; border:1px solid #000; padding:2px 5px; font-weight:bold; } .asterix { color:#FF0000; } input { background-color: #FFFFFF; } .centerlegend { color:#FFFFFF; font-size:12px; position:absolute; top:-10px; background:#7E8961; border:1px solid #000; padding:2px 5px; font-weight:bold; left: 300px; } -->
<div id="holder">
<div class="form_elements"><fieldset><legend>1. Subjects</legend>
<div class="form_content"><span class="asterix">*</span>Subject course you wish to apply for:<br />
<table border="1" cellspacing="0" width="0" bgcolor="#ffffff" bordercolor="#666666">
<tbody>
ETC...
I've got Chrono Contact 3.0 Stable.
Chrono Contact 2.5 V2.5_J1.5_RC3.1 was fine with my same code.
Here's how it looks in the Email Template creator after I paste it in.
<!-- #holder { width:900px; text-align:left; margin:0 auto; } body { font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-align: center; } .form_elements_center { margin:20px; text-align:center; } .form_elements { margin:20px; } .form_content { margin:5px; } .form_content_center { margin:5px; text-align:center; } input, textarea, select { font-family:Arial, Helvetica, sans-serif; } table { font-family: Arial, Helvetica, sans-serif; font-size: 12px; } fieldset { position:relative; background:#dbe3c5; padding-top:20px; } legend { color:#FFFFFF; font-size:12px; position:absolute; top:-10px; background:#7E8961; border:1px solid #000; padding:2px 5px; font-weight:bold; } .asterix { color:#FF0000; } input { background-color: #FFFFFF; } .centerlegend { color:#FFFFFF; font-size:12px; position:absolute; top:-10px; background:#7E8961; border:1px solid #000; padding:2px 5px; font-weight:bold; left: 300px; } -->
<div id="holder">
<div class="form_elements"><fieldset><legend>1. Subjects</legend>
<div class="form_content"><span class="asterix">*</span>Subject course you wish to apply for:<br />
<table border="1" cellspacing="0" width="0" bgcolor="#ffffff" bordercolor="#666666">
<tbody>
ETC...
Hi kujina,
The CSS won't be recognised unless it's inside <style type="text/css" >. . .</style> tags
AND you can't rely on mail readers to use CSS in style tags correctly - safer to put it in the html tags directly even if this means repeating a lot of it :-(
Bob
The CSS won't be recognised unless it's inside <style type="text/css" >. . .</style> tags
AND you can't rely on mail readers to use CSS in style tags correctly - safer to put it in the html tags directly even if this means repeating a lot of it :-(
Bob
Hi kujina,
The CSS won't be recognised unless it's inside <style type="text/css" >. . .</style> tags
I did, thats why I'm really puzzeled, here is how it looked in its original form before it gets turned into what you see in my first post.
<style type="text/css">
#holder {
width:900px;
text-align:left;
margin:0 auto;
}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: center;
}
.form_elements_center {
margin:20px;
text-align:center;
}
.form_elements {
margin:20px;
}
.form_content {
margin:5px;
}
.form_content_center {
margin:5px;
text-align:center;
}
input, textarea, select {
font-family:Arial, Helvetica, sans-serif;
}
table {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
fieldset {
position:relative;
background:#dbe3c5;
padding-top:20px;
}
legend {
color:#FFFFFF;
font-size:12px;
position:absolute;
top:-10px;
background:#7E8961;
border:1px solid #000;
padding:2px 5px;
font-weight:bold;
}
.asterix {
color:#FF0000;
}
input {
background-color: #FFFFFF;
}
.centerlegend {
color:#FFFFFF;
font-size:12px;
position:absolute;
top:-10px;
background:#7E8961;
border:1px solid #000;
padding:2px 5px;
font-weight:bold;
left: 300px;
}
</style>
<div id="holder">
<div class="form_elements">
<fieldset>
<legend>1. Subjects</legend>
<div class="form_content">
<span class="asterix">*</span>Subject course you wish to apply for:<br />
<table width="0" border="1" cellspacing="0" bordercolor="#666666" bgcolor="#FFFFFF">
<tr>
<td>{course}</td>
</tr>
</table>
</div>
ETC...
Hi Kujina,
Hmm. Are you using the on-line editor? That may well 'tidy' up the html. Try disabling it so that you can edit the raw html.
Bob
Hmm. Are you using the on-line editor? That may well 'tidy' up the html. Try disabling it so that you can edit the raw html.
Bob
This topic is locked and no more replies can be posted.