Solved

Help in CSS

Posted on 2016-08-17
5
36 Views
Last Modified: 2016-11-08
Hi guys,
I am not very fluent with CSS and i am using a web based reporting tool (BIRT from Actuate). They give functionality to import the CSS sheets. However i can only import CSS2 style sheets and in a specific format.
Was just wondering how can i write the following code in .table-detail class within CSS.#
The code which needs to be embedded with in the class is
* {
  font-family: Helvetica Neue, Arial, sans-serif;
}

body {
  background-image: linear-gradient(#aaa 25%, #000);
}

h1,
table {
  text-align: center;
}

table {
  border-collapse: collapse;
  width: 70%;
  margin: 0 auto 5rem;
}

th,
td {
  padding: 1.5rem;
  font-size: 1.3rem;
}

tr {
  background: hsl(50, 50%, 80%);
}

tr,
td {
  transition: .4s ease-in;
}

tr:first-child {
  background: hsla(12, 100%, 40%, 0.5);
}

tr:nth-child(even) {
  background: hsla(50, 50%, 80%, 0.7);
}

td:empty {
  background: hsla(50, 25%, 60%, 0.7);
}

tr:hover:not(#firstrow),
tr:hover td:empty {
  background: #ff0;
  pointer-events: visible;
}

tr:hover:not(#firstrow) {
  transform: scale(1.2);
  font-weight: 700;
  box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.5);
}

Open in new window


looking forward for your help.

regards
0
Comment
Question by:shah36
5 Comments
 
LVL 17

Assisted Solution

by:Serena Hsi
Serena Hsi earned 250 total points
ID: 41759799
W3Schools.com is my goto tutorial reference for html and css syntax.

See here for CSS Table references.

Each formatting element within CSS allows you to 'standardize' how something will look on a web page. To add additional classes or to modify a table class, go to line 14 of your example and add it there.

However, in your case, you need to add an additional CSS entry (and not use Table as I had previously suggested) and call it:

table-detail { whatever whatever ; }

When you are calling that CSS format in HTML, it would look something like this:

<div class="table-detail">
  <table class="table-detail">
    ...
  </table>
</div>

Open in new window

0
 
LVL 51

Expert Comment

by:Julian Hansen
ID: 41759844
I am not sure I understand what you are asking.

Why the requirement for CSS2 - is the report being rendered somewhere other than in a browser?

In your styles you have transitions which are CSS3?
0
 
LVL 3

Accepted Solution

by:
Donna earned 250 total points
ID: 41759849
whether or not you use table is irrelevant, and does not answer your question. Some things require a table, simple as that. While nowadays it's better form to use a div tag, that doesn't not rescind every need to use a table either...and it HTML and has absolutely nothing to do with CSS, so I don't know why she wrote that.

CSS for the most part, is backwards compatible, with the exception of those attributes that have been deprecated. And from what I understand, BIRT is no longer BIRT but is now called "Open Text Analytics" which is premium software...so are you sure you are using their latest package? Because I can't imagine in this day & age, that their software would not be CSS3 compliant.

Anyways, without getting off the basic question, there is no difference between CSS2 and CSS3 filewise, except for internally possibly having a depracated feature. The file name/type/extension is all the same, it's just somefile.css ...nothing special. And a CSS file is basically just text and opens with any notepad. And the only thing that is different, is the addition of a LOT of new features added to CSS3...it's grown. But CSS2 is a part of CSS3...as is CSS1...a development environment would tell you if an attribute was deprecated or not.

To know if anything is deprecated, you can I suppose look up each item on W3C (that part of her post was good info) , but if you are getting some error specifically on BIRT, maybe go to them for the support of their product? (most logical)

Good luck.
0
 

Author Comment

by:shah36
ID: 41765067
Thank you very much for your answers. It gave me help to learn bit of CSS. However BIRT does supports only one style at a time. So for instance we can not apply a whole style sheet on a BIRT table but can only apply a class from a style sheet on BIRT table.

thanks a lot
0
 
LVL 3

Expert Comment

by:Donna
ID: 41879629
well you dont have to use birt...try programmer's notepad...its free. Open the whole stylesheet, and edit what you want. Get CSS info on syntax from W3C
0

Featured Post

Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

Join & Write a Comment

Unordered lists (HTML ul tags) are very handy to create menus of all types, shapes and sizes.  All it takes is a little knowledge of CSS and the possibilities are endless. First off, you should know the general format for menus created using the …
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…

705 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

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now