Solved

Help in CSS

Posted on 2016-08-17
5
46 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 18

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 53

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

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

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 …
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

863 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

19 Experts available now in Live!

Get 1:1 Help Now