Bug 456504 - [CSS] The cascading structure of the "inherit" value is not completely resolved due to the CSS standard
Summary: [CSS] The cascading structure of the "inherit" value is not completely resolv...
Status: NEW
Alias: None
Product: Platform
Classification: Eclipse Project
Component: UI (show other bugs)
Version: 4.5   Edit
Hardware: PC Linux
: P3 normal (vote)
Target Milestone: ---   Edit
Assignee: Platform UI Triaged CLA
QA Contact:
URL:
Whiteboard:
Keywords:
Depends on: 419377
Blocks:
  Show dependency tree
 
Reported: 2015-01-02 05:06 EST by Simon Scholz CLA
Modified: 2019-10-02 06:25 EDT (History)
2 users (show)

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Simon Scholz CLA 2015-01-02 05:06:24 EST 
Due to my comment in Bug https://bugs.eclipse.org/bugs/show_bug.cgi?id=419377 I open a new Bug for the parent inheritance inconsistencies.

There I figured out that the cascading structure of CSS is not completely considered when using the "inherit" value.

In a sample application with one MPart and a Label on it the text does not become orange by this CSS definitions:

Composite {
   background-color: black;
   color: orange;
}

Composite Label {
   color: inherit;
}

Only after I added the .MPart CSS class it worked as desired:

.MPart, Composite {
   background-color: black;
   color: orange;
}

Composite Label {
   color: inherit;
}

The parent of the Label is a CompositeElement, which seems to wrap the MPart I guess, but even without using the .MPart class as CSS selector it should work due to normal CSS rules.


A second issue is that it seems that the implementation of Bug 419377 just checks if the direct parent got a value to inherit from and not for its grandparents.

Usually an element should check the parents "id" CSS defintions, "class" CSS definitions and then for CSS definitions due to the name of the element itself.
See this as an example:
<html>
	<head>
		<style>
		.grandparent {
		   color: red;
		}

		.parent {
		   color: green;
		}

		div {
		   color: blue;
		}

		p {
		   color: inherit;
		}
		</style>
	</head>
	<body>
		<div class="grandparent"><div class="parent"><p>This is a test</p></div></div>
	</body>
</html>

Here the .parent class color definition is taken. When removing the color definition from the parent class the div color definition will be taken and if also the div does not define a color the .gradparents color definition will be taken.