How to avoid to CSS styles to "collide"

Dev Shed Forums Sponsor:

July 29th, 2004, 12:31 PM

Malinali

Contributing User

Join Date: Jun 2003

Location: Buenos Aires, Argentina

Posts: 74

Time spent in forums: < 1 sec
Reputation Power: 6

How to avoid to CSS styles to "collide"

I'm not used to DTD, and in this case I think this is easier this way: I'm showing here a lame layout of how my XML is. Imagine it's well-formatted XML

Code:

<documents>
  <page>
    <html>
      <head>
        <style>.styleOne {color:#FF0000}<style>
      </head>
      <body>
        <font class="styleOne">Hi</font>
      </body>
    </html>
  </page>
  <page>
    <html>
      <head>
        <style>.styleOne {color:#0000FF}<style>
      </head>
      <body>
        <font class="styleOne">Hi</font>
      </body>
    </html>
   </page>
</documents>

Then, my XSL should produce something like this:

Hi
Hi

If I use

Code:

<xsl:for-each select="page">
   <xsl:copy-of select="page"/>
   <br/>
</xsl:for-each>

It produces

Hi
Hi

and it will not work on IE6 anyway (the first </html> will close the entire page)

If instead I use

Code:

<xsl:for-each select="page//body/*">
   <xsl:copy-of select="page"/>
   <br/>
</xsl:for-each>

It will produce

Hi
Hi

Because it hasn't had the Styles. Does anyone know how to solve this?

July 29th, 2004, 01:17 PM

Teflon

Teflon The Black

Join Date: Feb 2004

Location: Woodbridge VA

Posts: 246

Time spent in forums: 4 h 28 m 14 sec
Reputation Power: 5

it has the styles, check your well formedness as well as your style names.

PHP Code:


		
			
<?xml version="1.0" encoding="ISO-8859-1" ?>

<?xml-stylesheet type="text/xsl" href="test.xsl"?>

<documents>

  <page>

    <html>

      <head>

        <style>.styleOne {color:#FF0000}</style>

      </head>

      <body>

        <font class="styleOne">Hi</font>

      </body>

    </html>

  </page>

  <page>

    <html>

      <head>

        <style>.styleTwo {color:#0000FF}</style>

      </head>

      <body>

        <font class="styleTwo">Hi</font>

      </body>

    </html>

   </page>

</documents>

and

PHP Code:


		
			
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

    <xsl:output method="html"/>



    <xsl:template match="documents/page">

        <xsl:for-each select=".">

            <xsl:copy-of select="."/>

        </xsl:for-each>

    </xsl:template>



</xsl:stylesheet>

worked just right for me

__________________
Teflon - The Black <desc>Mark This Up</desc>

July 29th, 2004, 01:51 PM

kid23

Contributing User

Join Date: Jun 2004

Posts: 62

Time spent in forums: < 1 sec
Reputation Power: 5

I'd provide another answer than Teflon's (no offense

).
Actually, XML + XSL is supposed to turn into ONE html file, therefore you're only supposed to have the <html> tag (as well as <head> and <body>) only once in the resulting file.

So my suggestion would be to change the way you structure your files, I'd rather make something like this:

Code:

<documents> 
  <page> 
        <style>.styleOne {color:#FF0000}</style> 
        <font class="styleOne">Hi</font> 
  </page> 
  <page> 
        <style>.styleTwo {color:#0000FF}</style> 
        <font class="styleTwo">Hi</font> 
   </page> 
</documents>

and this into xsl:

Code:

<xsl:template match="documents">
  <html>
    <head>
      <style>
        <xsl:apply-templates select="//style" />
      </style>
    </head>
    <body>
        <xsl:apply-templates select="//font" />
    </body>
  </html>
</xsl:template>

<xsl:template match="font">
  <font class="{@class}">
    <xsl:value-of select="text()" />
  </font>
</xsl:template>

Hope this helps.

July 29th, 2004, 02:23 PM

Teflon

Teflon The Black

Join Date: Feb 2004

Location: Woodbridge VA

Posts: 246

Time spent in forums: 4 h 28 m 14 sec
Reputation Power: 5

Very good point kid23.

July 29th, 2004, 05:22 PM

Malinali

Contributing User

Join Date: Jun 2003

Location: Buenos Aires, Argentina

Posts: 74

Time spent in forums: < 1 sec
Reputation Power: 6

I know that the structure is not the best ever, but "no can't don't"

The XML source and its DTD are not on reach of my greedy hands. Sometimes you have to be user-compliant instead of standard-compliant.

Most of the <page> elements contain HTML with the styles applied the "inline" way, because they come from a rich text editor and with those the second way I wrote works just fine.

But sometimes instead of using the editor the users import an HTML file or copy&paste from that horrible Word 2000 and that's the way I get that kind of structure.

Thanks anyway, I will post if I find it.

July 30th, 2004, 03:34 AM

kid23

Contributing User

Join Date: Jun 2004

Posts: 62

Time spent in forums: < 1 sec
Reputation Power: 5

Ow.. I see.. then, if you can't get rid of this structure, you can still use my solution, but you have to adjust it a little.

First, the fact that the main html tags may appear only once is still valid, so you need to keep them written by the template of your root element.

To make sure they don't get processed, you should write empty templates for them, something like this:

<xsl:template match="html | head | body" />

That would do the same as the solution I had proposed, but without having to remove your tags.

I'm not even sure that writing an empty translation rule is mandatory.. but you should give it a try.

Let me know how it works.

July 30th, 2004, 10:38 AM

Malinali

Contributing User

Join Date: Jun 2003

Location: Buenos Aires, Argentina

Posts: 74

Time spent in forums: < 1 sec
Reputation Power: 6

Thanks Kid23, I'll keep you posted.

Viewing: Dev Shed Forums > Programming Languages - More > XML Programming > How to avoid to CSS styles to "collide"

« Previous Thread | Next Thread »

Thread Tools	Search this Thread
Email this Page	Search this Thread: Advanced Search
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread:

Posting Rules
You may not post new threads You may not post replies You may not post attachments You may not edit your posts vB code is On Smilies are On [IMG] code is On HTML code is Off

View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox

Forum Jump

Free IT White Papers!

How to Present Effectively Online
This white paper offers practical and actionable advice on the key steps that any presenter should consider as they plan and execute a Webinar or online meeting.

Open Source Security Myths
Open Source Software (OSS) is computer software whose source code is available to the general public with relaxed or non-existent intellectual property restrictions (or arrangement such as the public domain), and is usually developed with the input of many contributors.

Power and Cooling Capacity Management for Data Centers
This paper describes the principles for achieving power and cooling capacity management.

Scalable, Fault-Tolerant NAS for Oracle - The Next Generation
For several years NAS has been evolving as a storage alternative for Oracle databases, and for good reason: NAS is quite often the simplest, most cost-effective storage approach for Oracle. Learn about the benefits that HP's approach to scalable NAS brings to Oracle environments in this comprehensive white paper.

Understanding Web Application Security Challenges
This white paper discusses many common threats and preventive measures for Web application security, and explains what you can do to help protect your organization.

More Free IT White Papers!