Skip to main content



      Home
Home » Archived » BIRT » Use CSS to position div in a BIRT Report
Use CSS to position div in a BIRT Report [message #509166] Thu, 21 January 2010 09:56 Go to next message
Eclipse UserFriend
Hi all,

I'm trying to use an external css to position div elements I have created in my Birt report.
I use a Text element (with HTML Format) in which I have declared my div element. I have a css file which defines position of these div elements but I dont' achieve to use it. When I try the "Use CSS File" option in BIRT, BIRT doesn't recognize my style.

So, is it possible to do such a thing ? And, if it is, how ?

Thanx in advance for any help,

Jack

[Updated on: Thu, 21 January 2010 09:57] by Moderator

Re: Use CSS to position div in a BIRT Report [message #509283 is a reply to message #509166] Thu, 21 January 2010 15:25 Go to previous messageGo to next message
Eclipse UserFriend
Jack,

Can you post the css sheet? Also would inline styles work?

Jason

abedi wrote:
> Hi all,
>
> I'm trying to use an external css to position div elements I have
> created in my Birt report.
> I use a Text element (with HTML Format) in which I have declared my div
> element. I have a css file which defines position of these div elements
> but I dont' achieve to use it. When I try the "Use external css" option
> in BIRT, BIRT doesn't recognize my style.
>
> So, is it possible to do such a thing ? And, if it is, how ?
>
> Thanx in advance for any help,
>
> Jack
Re: Use CSS to position div in a BIRT Report [message #509285 is a reply to message #509283] Thu, 21 January 2010 15:37 Go to previous messageGo to next message
Eclipse UserFriend
Hi Jason,

Thanx for your answer.
Below is the example css file I'm trying to use :
ol {position:relative; margin:0 10%; list-style:none;} 
ul {list-style:inside;} 
h1 {text-align:center;} 
#decouverte,#start,#services {position:absolute; width:25%; height:100%;} 
#start {right:50%;} 
#services {left:50%;} 
#power {margin-left:75%;}


I have put in a text element html code below :
<h1>Des solutions adaptées à vos besoins</h1> 
<ol> 
    <li id="decouverte"> 
        <h2>Offre "Découverte"</h2> 
        <p> 
            Cette offre de bienvenue vous donne accès 
            aux principales fonctionnalités du système: 
        </p> 
        <ul> 
            <li>Tout le catalogue disponible</li> 
            <li>Service accessible 24h/21</li> 
        </ul> 
    </li> 
    <li id="start"> 
        <h2>Offre "Start"</h2> 
        <p> 
            Cette offre d'entrée de gamme vous donne accès 
            aux principales fonctionnalités du système ainsi 
            que quelques bonus: 
        </p> 
        <ul> 
            <li>Tout le catalogue disponible</li> 
            <li>Service accessible 24h/21</li> 
            <li>Pas de frais d'activation</li> 
            <li>Interface entièrement personnalisable</li> 
        </ul> 
    </li> 
    <li id="services"> 
        <h2>Offre "Services+"</h2> 
        <p> 
            Cette offre très prisée vous donne accès 
            aux principales fonctionnalités du système 
            et aux nombreuses possibilités de partage: 
        </p> 
        <ul> 
            <li>Tout le catalogue disponible</li> 
            <li>Service accessible 24h/21</li> 
            <li>Pas de frais d'activation</li> 
            <li>Interface entièrement personnalisable</li> 
            <li>Possibilité de téléversement</li> 
            <li>Diffusion et stockage</li> 
        </ul> 
    </li> 
    <li id="power"> 
        <h2>Offre "PowerUser"</h2> 
        <p> 
            Cette offre vous donne accès à l'ensemble 
            des fonctionnalités du système pour une expérience 
            utilisateur supérieure, avec entre autres: 
        </p> 
        <ul> 
            <li>Tout le catalogue disponible</li> 
            <li>Service accessible 24h/21</li> 
            <li>Pas de frais d'activation</li> 
            <li>Interface entièrement personnalisable</li> 
            <li>Possibilité de téléversement</li> 
            <li>Diffusion et stockage</li> 
            <li>Création personnalisée de bibliothèques</li> 
            <li>Espace alloué illimité</li> 
            <li>Nombre d'alias illimté</li> 
            <li>... et bien plus encore!</li> 
        </ul> 
    </li> 
</ol>


But I don't know how to invoke my css file to position these element (result is to have 4 columns).

I hope I have been clear

[Updated on: Thu, 21 January 2010 15:37] by Moderator

Re: Use CSS to position div in a BIRT Report [message #509523 is a reply to message #509285] Fri, 22 January 2010 12:02 Go to previous messageGo to next message
Eclipse UserFriend
Can you inline the style like:

<h1>Des solutions adaptées à vos besoins</h1> <ol
style=" background-color:green;position:relative;color:blue;margin:0
10%;"> ....

Jason

abedi wrote:
> Hi Jason,
>
> Thanx for your answer.
> Below is the example I'm trying to use :
>
> ol {position:relative; margin:0 10%; list-style:none;} ul
> {list-style:inside;} h1 {text-align:center;}
> #decouverte,#start,#services {position:absolute; width:25%;
> height:100%;} #start {right:50%;} #services {left:50%;} #power
> {margin-left:75%;}
>
>
> I have put in a text element html code below :
>
> <h1>Des solutions adaptées à vos besoins</h1> <ol> <li
> id="decouverte"> <h2>Offre "Découverte"</h2> <p>
> Cette offre de bienvenue vous donne accès aux
> principales fonctionnalités du système: </p> <ul>
> <li>Tout le catalogue disponible</li> <li>Service
> accessible 24h/21</li> </ul> </li> <li id="start">
> <h2>Offre "Start"</h2> <p> Cette offre d'entrée de
> gamme vous donne accès aux principales fonctionnalités du
> système ainsi que quelques bonus: </p> <ul>
> <li>Tout le catalogue disponible</li> <li>Service
> accessible 24h/21</li> <li>Pas de frais d'activation</li>
> <li>Interface entièrement personnalisable</li> </ul>
> </li> <li id="services"> <h2>Offre "Services+"</h2>
> <p> Cette offre très prisée vous donne accès aux
> principales fonctionnalités du système et aux nombreuses
> possibilités de partage: </p> <ul> <li>Tout le
> catalogue disponible</li> <li>Service accessible 24h/21</li>
> <li>Pas de frais d'activation</li> <li>Interface
> entièrement personnalisable</li> <li>Possibilité de
> téléversement</li> <li>Diffusion et stockage</li>
> </ul> </li> <li id="power"> <h2>Offre "PowerUser"</h2>
> <p> Cette offre vous donne accès à l'ensemble
> des fonctionnalités du système pour une expérience
> utilisateur supérieure, avec entre autres: </p> <ul>
> <li>Tout le catalogue disponible</li> <li>Service
> accessible 24h/21</li> <li>Pas de frais d'activation</li>
> <li>Interface entièrement personnalisable</li>
> <li>Possibilité de téléversement</li> <li>Diffusion et
> stockage</li> <li>Création personnalisée de
> bibliothèques</li> <li>Espace alloué illimité</li>
> <li>Nombre d'alias illimté</li> <li>... et bien plus
> encore!</li> </ul> </li> </ol>
>
>
> But I don't know how to invoke my css file to position these element
> (result is to have 4 columns).
>
> I hope I have been clear
>
Re: Use CSS to position div in a BIRT Report [message #509580 is a reply to message #509523] Sat, 23 January 2010 02:49 Go to previous messageGo to next message
Eclipse UserFriend
In fact, this css file comes from another web application, and the aim is to use it as is.
So I can't inline the style like you told me.

As in an HMTL page, I'd like to use a CSS just by linking it

Jack
Re: Use CSS to position div in a BIRT Report [message #509842 is a reply to message #509580] Mon, 25 January 2010 05:16 Go to previous messageGo to next message
Eclipse UserFriend
Jack,

Try to create a dummy css file to put in the resource folder when you
are in the designer. When you use the external style sheet feature, use
the check box to apply a view time css, which you should specify a file
path or url to. Finally preview in the web viewer instead of the
preview tab.

Jason

abedi wrote:
> In fact, this css file comes from another web application, and the aim
> is to use it as is.
> So I can't inline the style like you told me.
>
> As in an HMTL page, I'd like to use a CSS just by linking it
>
> Jack
Re: Use CSS to position div in a BIRT Report [message #509852 is a reply to message #509842] Mon, 25 January 2010 10:27 Go to previous message
Eclipse UserFriend
Also do not put the style in the text element just the HTML.

Jason

Jason Weathersby wrote:
> Jack,
>
> Try to create a dummy css file to put in the resource folder when you
> are in the designer. When you use the external style sheet feature, use
> the check box to apply a view time css, which you should specify a file
> path or url to. Finally preview in the web viewer instead of the
> preview tab.
>
> Jason
>
> abedi wrote:
>> In fact, this css file comes from another web application, and the aim
>> is to use it as is.
>> So I can't inline the style like you told me.
>>
>> As in an HMTL page, I'd like to use a CSS just by linking it
>>
>> Jack
Previous Topic:Out Of Memory With birt 2.5.1 while generating reports
Next Topic:I can't debug my birt report!
Goto Forum:
  


Current Time: Fri Sep 26 05:22:31 EDT 2025

Powered by FUDForum. Page generated in 0.05644 seconds
.:: Contact :: Home ::.

Powered by: FUDforum 3.0.2.
Copyright ©2001-2010 FUDforum Bulletin Board Software

Back to the top