CSS gurus: Any way to strip content out of tables from an RSS feed?

A Wordpress site I’m working on gets a lot of its content from another site’s RSS feed. That site is laid out suing tables, and so is the feed we’re getting. So the posts look like garbage when we plug them into our layout.

The semi-good-news is that each post from this feed is laid out in a 2-cell table: one cell for the left column (which always contains an image), one for the right (which always contains all of the text). So we’re not talking about dozens of cells that need sorting out.

Is there any way to use CSS to override these table displays? I’ve been trying clever things using float, etc., but to no real avail.

(We have asked the feed’s owner to style it without tables … but I’m not optimistic that he’ll get around to doing so anytime in the next century.)

This doesn’t really make sense to me…how is an rss feed styled with tables? RSS feeds are lists of items like:
<item …>
<title>…</title>
<link>…</link>
<description>

</description>
</item>

There is no styling information there…no tables, either.

At any rate, if you want a real answer to your question, post a link to the site/a link to a demo site showing your problem.

If you’re just using someone else’s software to handle grabbing and displaying the RSS data (e.g. WordPress), then you’re fairly well up a creek. If you have some PHP or something grabbing the RSS, you should be able to use DOM objects to search through the XML elements and separate out the stuff you want.

Yag - A lot of fools put html in the description or worse yet link field. Check out this site we have to consume & process (after we clean it up of course): http://www.tampagov.net/appl_rss_feeds/rss.asp?feed=police_calls

I see…I’ve been lucky enough to work with reasonable rss feeds. Or written my own.

Here’s an entry from the source site.

(feed here)

It’s going to be tough with CSS because the tables in their HTML have no IDs. So unless you are 100% positive you will never have a table tag on your Web site to which you do NOT want to apply your TABLE element style (or TD or TR), you will be screwed.

You could take the feed content and add an ID to a table tag (something like “replace <table with <table ID=tbl1”…) and then make CSS that affects only elements with the ID of tbl1…but if you can manage to do that you can manage to use the same logic to go the extra mile and strip table tags altogether.

Although now that I think of it, I think some browsers get mad when you have more than one element with the same ID and try to apply CSS to it. So every table would need a unique ID and thus a unique CSS entry (boo!)

Otherwise…what exactly do you want to do with the tables? Get rid of them? Stylize them differently?

You might consider posting your question to the Wordpress forums and ask how you can manipulate the Wordpress feed reader you are using to strip out HTML.

I’m making two assumptions here:

  1. Whatever browser you’re using supports css2 selectors.
  2. You only have the ‘broken’ tables in your post-content div. (or what Zipperjj said)

This should get you started…You didn’t mention what you were looking for, so change the actual properties to be whatever you want:



div.post-content table tr{
  display: block; 
}

div.post-content table tr td:first-child {
  float: right;
}

div.post-content table tr td:last-child{
   float: left;
}


Thanks, Yag. That set me down the right path. (I had forgotten about the first-child/last-child business; I’ve needed to use them before.) Actually, just hiding the first-child TDs (and making “safe” div classes for some other pages that use tables) took care of it, since the feed images are not that important as far as we’re concerned.