Solved

XSLT 2 column layout

Posted on 2010-09-17
4
491 Views
Last Modified: 2013-11-18
Hello,

I am new to XSL formatting. Thanks for your help in advance.

I have this XML file that I am trying to convert using xslt.

I have grouped the xml data into group by section.

The issue that I have is i am getting the results in a single column .
I would like to get in a 2 column layout.

I am attaching the xsl file that I am working on.

xml:
<Collection>
 <Content>
    <ID>100</ID>
    <Type>Content</Type>
    <Title>English test</Title>
    <QuickLink>http://google.com</QuickLink>
    <Html>
      <root>
        <issueDate>2010-08-15</issueDate>
        <BodyTitle>test</BodyTitle>
        <section>English</section>
              </root>
    </Html>
    <StartDate>1/1/2010</StartDate>

  </Content>
  <Content>
    <ID>101</ID>
    <Type>Content</Type>
    <Title>Physics Test</Title>
    <QuickLink>http://yahoo.com</QuickLink>
 
    <Html>
      <root>
        <issueDate>2010-08-31</issueDate>
        <BodyTitle>Physics In Brief</BodyTitle>
       
        <section>Physics</section>
       
      </root>
    </Html>
    <StartDate>1/1/2010</StartDate>

  </Content>
  <Content>
    <ID>102</ID>
    <Type>Content</Type>
    <Title>French</Title>
    <QuickLink>http://xml.net</QuickLink>
   
    <Html>
      <root>
        <issueDate>2010-08-31</issueDate>
        <BodyTitle>French rules</BodyTitle>
        <section>French</section>
     
      </root>
    </Html>
    <StartDate>1/1/2010</StartDate>

  </Content>
 
 
</Collection>


I am attaching the xsl file that I am working on .

testxsl.txt
0
Comment
Question by:all_experts
  • 2
  • 2
4 Comments
 
LVL 3

Expert Comment

by:VeganBen
ID: 33707557
You're outputting to HTML, so why not use the browser to sort out column widths.

Wrap everything in a DIV called twoColumns and add this to your CSS:


div#twoColumns {
      -moz-column-count: 2;
      -moz-column-gap: 20px;
      -webkit-column-count: 2;
      -webkit-column-gap: 20px;
      column-count: 2;
      column-gap: 20px;
}
0
 
LVL 1

Author Comment

by:all_experts
ID: 33713528
Hello VeganBen,

Thanks for your help.I have tried using your code but still it is not rendering the list properly.

It is a css 3 property and still not being implemented in the browsers.

Correct me if I am wrong.,
0
 
LVL 1

Accepted Solution

by:
all_experts earned 0 total points
ID: 33719256
Hello VeganBen,

Thanks for the help I was able to get that using xsl:attribute
0
 
LVL 3

Expert Comment

by:VeganBen
ID: 33741347
Glad you got it working.
It is a CSS property that is supported by Firefox, Safari and Chrome.

Oh, you mean IE? Do you count that as a web browser?
0

Featured Post

Webinar: Aligning, Automating, Winning

Join Dan Russo, Senior Manager of Operations Intelligence, for an in-depth discussion on how Dealertrack, leading provider of integrated digital solutions for the automotive industry, transformed their DevOps processes to increase collaboration and move with greater velocity.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Unable to resolve XML http request 4 98
API Soap Calls 4 126
Create html table using xsl 8 42
PowerShell script to remove string in xml file 3 31
Preface In the first article: A Better Website Login System (http://www.experts-exchange.com/A_2902.html) I introduced the EE Collaborative Login System and its intended purpose. In this article I will discuss some of the design consideratio…
Introduction Since I wrote the original article about Handling Date and Time in PHP and MySQL (http://www.experts-exchange.com/articles/201/Handling-Date-and-Time-in-PHP-and-MySQL.html) several years ago, it seemed like now was a good time to updat…
Viewers will learn about the regular for loop in Java and how to use it. Definition: Break the for loop down into 3 parts: Syntax when using for loops: Example using a for loop:
The viewer will learn how to count occurrences of each item in an array.

790 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question