This content has been marked as final.
Show 4 replies
-
1. Re: Fine in browser, bad in design view
Newsgroup_User Jun 1, 2007 12:02 AM (in response to BruceCSI2)BruceCSI2 wrote:
> PS: This is behind a firewall, so there's no way to post a link to the page.
>
Post the code here.
-
2. Re: Fine in browser, bad in design view
BruceCSI2 Jun 1, 2007 8:02 AM (in response to BruceCSI2)Okay, here it is.
--------------------------
<style type="text/css">
<!--
body {
text-align:center;
margin:0 auto;
background-color:#fff;
font-size:62.5%;
}
p {
font-family:Arial, Helvetica, sans-serif;
font-size:1.1em;
color:#000;
}
h1 {
font-family:"Times New Roman", Times, serif;
font-size:2.5em;
color:#00059b;
font-weight:bold;
}
h2 {
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
font-variant:small-caps;
font-size:1.5em;
color:#cc0000;
}
h3 {
font-family:Arial, Helvetica, sans-serif;
font-size:1.2em;
font-weight:bold;
color:#00059b;
text-align:center;
}
h4 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:1.2em;
color:#fff;
font-variant:small-caps
}
td.bullets {
background-image:url(graphics/aBulletpoint-Red.gif);
background-repeat:no-repeat;
background-position:center;
width:15px;
}
#wrapper {
text-align:left;
width:600px;
background-color:#fff;
padding-right:25px;
margin-top:25px;
}
#header {
width:100%;
}
#leftcolumn {
width:440px;
text-align:left;
float:left;
}
#indinsights, #bizbytes, #smtools {
width:100%;
border-bottom:1px solid #ccc;
margin-top:10px;
padding-bottom:15px;
}
#briefnotes {
width:100%;
margin-top:10px;
padding-bottom:15px;
}
#rightcolumn {
width:145px;
float:right;
}
#inside {
margin-top:10px;
float:right;
margin-right:0px;
width:100%;
background-image:url(graphics/tosbg.gif);
}
#imageholder {
margin-top:25px;
}
#topagents {
width:600px;
}
-->
</style>
</head>
<body>
<div id="wrapper">
<div id="header"><img src="graphics/Blue-Masthead-6-111406.jpg" alt="Sales First masthead" width="600" height="202" border="0" usemap="#Map" />
<map name="Map" id="Map"><area shape="rect" coords="7,18,105,63" href=" http://www.thewebsite.com" target="_blank" />
</map></div>
<div id="leftcolumn">
<div id="indinsights">
<table width="90%">
<tr>
<td width="58"><img src="graphics/ICON-Insights2.jpg" alt="Industry Insights" /> </td>
<td width="280" valign="middle"><h1>Industry Insights<a name="industryinsights" id="industryinsights"></a></h1></td>
</tr>
</table>
<h2>This is where the headline for the article goes
</h2>
<p>Insert 2 paragraphs of Lorem Ipsum text here</p>
</div>
<div id="bizbytes">
<table width="90%">
<tr>
<td width="58"><img src="graphics/ICON-Lightbulb2.jpg" alt="Business Bytes" width="50" height="50" /> </td>
<td width="280" valign="middle"><h1>Business Bytes<a name="bizbytes" id="bizbytes"></a></h1></td>
</tr>
</table>
<h2>This is where the headline for the article goes
</h2>
<p>Insert 2 paragraphs of Lorem Ipsum text here.</p>
</div>
<div id="smtools">
<table width="90%">
<tr>
<td width="58"><img src="graphics/ICON-Tools2.jpg" alt="Sales Managers Toolbox" width="50" height="50" /> </td>
<td width="280" valign="middle"><h1>Sales Manager's Toolbox<a name="smtools" id="smtools"></a></h1></td>
</tr>
</table>
<h2>This is where the headline for the article goes
</h2>
<p>Insert 2 paragraphs of Lorem Ipsum text here</p>
</div>
<div id="briefnotes">
<table width="90%">
<tr>
<td width="58"><img src="graphics/ICON-Memos2.jpg" alt="Briefly Noted" width="50" height="50" /> </td>
<td width="280" valign="middle"><h1>Briefly Noted<a name="briefnote" id="briefnote"></a></h1></td>
</tr>
</table>
<p>Following is an overview of recent announcements.
</p>
<table width="100%" border="1" cellspacing="0" cellpadding="2">
<tr>
<td width="11%"><div align="center">
<p><b>Memo</b></p>
</div></td>
<td width="75%"><p><b>Title and Introduction </b></p></td>
<td width="14%"><p><b>Date</b></p></td>
</tr>
<tr>
<td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
</tr>
<tr>
<td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
</tr>
<tr>
<td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
</tr>
</table>
<p>This overview is provided for your convenience and is intended only as a summary and reminder of recent announcements. We strongly encourage you to access the Memos section of MAO daily for important business updates.</p>
</div>
</div>
<div id="rightcolumn">
<div id="inside">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="graphics/TOCCORNER.gif" width="28" height="19" /></td>
<td width="82%"> </td>
</tr>
<tr>
<td bgcolor="#0067A4"> </td>
<td bgcolor="#0067A4"><h4>inside</h4></td>
</tr>
<tr>
<td class="bullets"> </td>
<td><p><a href="#industryinsights">Industry Insights</a><br />
The description goes here </p></td>
</tr>
<tr>
<td class="bullets"> </td>
<td><p><a href="#bizbytes">Business Bytes</a><br />
The description goes here </p></td>
</tr>
<tr>
<td class="bullets"> </td>
<td><p><a href="#smtools">Sales Manager's Toolbox</a><br />
The description goes here
</p></td>
</tr>
<tr>
<td class="bullets"> </td>
<td><p><a href="#briefnote">Briefly Noted</a><br />
An Overview of Recent Memos <br />
</p></td>
</tr>
<tr>
<td class="bullets"> </td>
<td><p>Top Agent Offices <br />
Year-to-Date Sales Rankings </p></td>
</tr>
<tr>
<td><img src="graphics/TOCbottomCORNER.gif" width="28" height="19" /></td>
<td> </td>
</tr>
</table>
</div>
<div id="imageholder">
<img src="graphics/DeliveryMan.jpg" width="134" height="133" /> </div>
</div> <br style="clear: both;">
<div id="topagents">
fjaklf
</div>
</div>
</body>
</html>
--------------------------
Thanks to anyone who can help. As noted, you may have to insert 2 paragraphs of Lorem Ipsum text to see what's happening. I had to remove it because of message size restrictions. Also, the div would move as soon as I put the picture of the delivery man in the right column. -
3. Re: Fine in browser, bad in design view
Newsgroup_User Jun 1, 2007 10:45 AM (in response to BruceCSI2)This should work ok. It was probably to do with not giving the tables a
specific width. I have now and it seems stable in design view.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
" http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
text-align:center;
background-color:#fff;
font-size:62.5%;
}
#wrapper {
text-align:left;
width:600px;
background-color:#fff;
margin-top:25px;
border: 1px solid #000;
margin: 0 auto;
}
p {
font-family:Arial, Helvetica, sans-serif;
font-size:1.1em;
color:#000;
}
h1 {
font-family:"Times New Roman", Times, serif;
font-size:2.5em;
color:#00059b;
font-weight:bold;
}
h2 {
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
font-variant:small-caps;
font-size:1.5em;
color:#cc0000;
}
h3 {
font-family:Arial, Helvetica, sans-serif;
font-size:1.2em;
font-weight:bold;
color:#00059b;
text-align:center;
}
h4 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:1.2em;
color:#fff;
font-variant:small-caps
}
td.bullets {
background-image:url(graphics/aBulletpoint-Red.gif);
background-repeat:no-repeat;
background-position:center;
width:15px;
}
#header {
}
#leftcolumn {
width:440px;
text-align:left;
float:left;
}
#indinsights, #bizbytes, #smtools {
width:100%;
border-bottom:1px solid #ccc;
margin-top:10px;
padding-bottom:15px;
}
#briefnotes {
width:100%;
margin-top:10px;
padding-bottom:15px;
}
#rightcolumn {
width:145px;
float:right;
}
#inside {
margin-top:10px;
background-image:url(graphics/tosbg.gif);
}
#imageholder {
margin-top:25px;
}
#topagents {
width:600px;
}
-->
</style>
</head>
<body>
<div id="wrapper">
<div id="header"><img src="graphics/Blue-Masthead-6-111406.jpg"
alt="Sales
First masthead" width="600" height="202" border="0" usemap="#Map" />
<map name="Map" id="Map"><area shape="rect" coords="7,18,105,63"
href=" http://www.thewebsite.com" target="_blank" />
</map></div>
<div id="leftcolumn">
<div id="indinsights">
<table width="440">
<tr>
<td width="58"><img src="graphics/ICON-Insights2.jpg" alt="Industry
Insights" /> </td>
<td width="280" valign="middle"><h1>Industry Insights<a
name="industryinsights" id="industryinsights"></a></h1></td>
</tr>
</table>
<h2>This is where the headline for the article goes
</h2>
<p>Insert 2 paragraphs of Lorem Ipsum text here</p>
</div>
<div id="bizbytes">
<table width="90%">
<tr>
<td width="58"><img src="graphics/ICON-Lightbulb2.jpg" alt="Business
Bytes" width="50" height="50" /> </td>
<td width="280" valign="middle"><h1>Business Bytes<a name="bizbytes"
id="bizbytes"></a></h1></td>
</tr>
</table>
<h2>This is where the headline for the article goes
</h2>
<p>Insert 2 paragraphs of Lorem Ipsum text here.</p>
</div>
<div id="smtools">
<table width="90%">
<tr>
<td width="58"><img src="graphics/ICON-Tools2.jpg" alt="Sales
Managers
Toolbox" width="50" height="50" /> </td>
<td width="280" valign="middle"><h1>Sales Manager's Toolbox<a
name="smtools" id="smtools"></a></h1></td>
</tr>
</table>
<h2>This is where the headline for the article goes
</h2>
<p>Insert 2 paragraphs of Lorem Ipsum text here</p>
</div>
<div id="briefnotes">
<table width="90%">
<tr>
<td width="58"><img src="graphics/ICON-Memos2.jpg" alt="Briefly
Noted"
width="50" height="50" /> </td>
<td width="280" valign="middle"><h1>Briefly Noted<a name="briefnote"
id="briefnote"></a></h1></td>
</tr>
</table>
<p>Following is an overview of recent announcements.
</p>
<table width="100%" border="1" cellspacing="0" cellpadding="2">
<tr>
<td width="11%"><div align="center">
<p> Memo</p>
</div></td>
<td width="75%"><p> Title and Introduction </p></td>
<td width="14%"><p> Date</p></td>
</tr>
<tr>
<td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
</tr>
<tr>
<td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
</tr>
<tr>
<td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
</tr>
</table>
<p>This overview is provided for your convenience and is intended
only as a
summary and reminder of recent announcements. We strongly encourage you to
access the Memos section of MAO daily for important business updates.</p>
</div>
</div>
<div id="rightcolumn">
<div id="inside">
<table width="145" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="graphics/TOCCORNER.gif" width="28" height="19" /></td>
<td width="82%"> </td>
</tr>
<tr>
<td bgcolor="#0067A4"> </td>
<td bgcolor="#0067A4"><h4>inside</h4></td>
</tr>
<tr>
<td class="bullets"> </td>
<td><p><a href="#industryinsights">Industry Insights</a><br />
The description goes here </p></td>
</tr>
<tr>
<td class="bullets"> </td>
<td><p><a href="#bizbytes">Business Bytes</a><br />
The description goes here </p></td>
</tr>
<tr>
<td class="bullets"> </td>
<td><p><a href="#smtools">Sales Manager's Toolbox</a><br />
The description goes here
</p></td>
</tr>
<tr>
<td class="bullets"> </td>
<td><p><a href="#briefnote">Briefly Noted</a><br />
An Overview of Recent Memos <br />
</p></td>
</tr>
<tr>
<td class="bullets"> </td>
<td><p>Top Agent Offices <br />
Year-to-Date Sales Rankings </p></td>
</tr>
<tr>
<td><img src="graphics/TOCbottomCORNER.gif" width="28" height="19"
/></td>
<td> </td>
</tr>
</table>
</div>
<div id="imageholder">
<img src="graphics/DeliveryMan.jpg" width="134" height="133" /> </div>
</div><!-- end rightcolumn -->
<br style="clear: both;">
<div id="topagents">
fjaklf
</div>
</div>
</body>
</html>
</html>
-
4. Re: Fine in browser, bad in design view
BruceCSI2 Jun 1, 2007 11:33 AM (in response to BruceCSI2)Unfortunately, not so on my machine. hmmmmmm
Thanks though.


