No replies
cvecchi's picture
Last seen: 10 years 48 weeks ago
Timezone: GMT-5
Joined: 2011-02-26
Posts: 1
Points: 2

Good afternoon,

I have an html page that utilizes a CSS sheet for the styling. Within this page, I am pulling in dynamic email content (using a Wordpress loop) that occasionally includes it's own html/css formatting. This is causing a formatting conflict I can't seem to figure out.

Here's what the page should look like:

Here's how the page is displaying due to the conflict. Note specifically the change in font size on the menu on the left side of the page.

In order to diagnose the issue, I ran the php / wordpress loop and copied the relevant page source it produced below. It may not be perfect, as I trimmed it down significantly to as to not "code dump" in the forum. The code pulled in by the wordpress loop is commented out as "-- WORDPRESS BEGIN --":

<link rel="stylesheet" type="text/css" media="screen,projection" href="./css/style_screen.css" />
<link rel="stylesheet" type="text/css" media="print" href="./css/style_print.css" />
<style type="text/css">
.style12 {font-size: 12px}
.style13 {font-weight: bold}
.style14 {font-weight: bold}
<div class="content1-container" align="left">
<h1>test html test</h1>
<style type="text/css">
body { font-family: Verdana, Arial, Helvetica, sans-serif; cursor: auto; color: #000000; padding: 0px 0px 0px 0px; }
a { text-decoration: underline; color: #006666; }
a:active {color: #06ab22; }
a:hover {color: #06ab22; }
td { font-family: Arial, Helvetica, sans-serif; font-style: normal; font-size: 10pt; }
img {border: 0px;}
<p><html><body class="text"><br />
<div align="left"><font face="Verdana, Arial, Helvetica, sans-serif" size="2">
Notification from: <b>blah blah</b></p>
<p><P>test class</P><br />
<hr /><span style="font-weight: bold">Attachments available for 30 days until Monday, March 28, 2011:</span><br /><a target="_blank" href="">test.pdf</a><br />
<hr />
<br />
<br />
<p><a href="">Log in</a></p>

I have full control over the website's css files, but unfortunately I'm stuck with the coding that is used within the emails as they are incorporated into the page automatically. My ultimate goal is to somehow allow the incoming dynamic emails to style themselves, while leaving the styling of my existing website alone.

Any assistance or suggestions would be most appreciated!!