Project

General

Profile

Actions

Bug #1077

closed

Later added external CSS file overriten by Wt's internal CSS file

Added by 太极美术工程狮 狮长 over 12 years ago. Updated almost 12 years ago.

Status:
Closed
Priority:
Normal
Assignee:
Target version:
Start date:
11/30/2011
Due date:
% Done:

0%

Estimated time:

Description

I'm using Wt3.1.11.

I need to switch the CSS file used dynamically.

In my code , I will add a new CSS file using "WApplication::useStyleSheet" according to some conditions. This CSS file will conflict with the internal "wt.css" , it changes the style of ".Wt-tabs". I expected the new added CSS file to overrite "wt.css" , but that didn't happen.

I found that the new added CSS is linked in the

element , and the internal "wt.css" is imported in the

element . So that the internal "wt.css" has a higher priority as it appears later. Is that right ?(I don't know much about CSS overriting rule). If so , I think Wt generated the wroing html code . The internal "wt.css" should be referenced in the html code at the very first so that it will be overriten by custom CSS files.


Files

Wt3.1.11CSS覆盖.png (183 KB) Wt3.1.11CSS覆盖.png Capture of firebug 太极美术工程狮 狮长, 11/30/2011 04:50 AM
WtCssProblem.zip (252 KB) WtCssProblem.zip A simple project 太极美术工程狮 狮长, 12/09/2011 05:03 AM
Actions #1

Updated by Koen Deforche over 12 years ago

  • Status changed from New to Feedback
  • Assignee set to Koen Deforche

Hey,

Stylesheets you add using useStyleSheet() really take precedence over Wt's own stylesheets. We often rely on this feature ourselves, so I would like to learn a more specific case of where you see things go wrong.

Regards,

koen

Actions #2

Updated by 太极美术工程狮 狮长 over 12 years ago

Koen Deforche wrote:

Hey,

Stylesheets you add using useStyleSheet() really take precedence over Wt's own stylesheets. We often rely on this feature ourselves, so I would like to learn a more specific case of where you see things go wrong.

Regards,

koen

I attached a project that shows the problem.

I use qmake as the project manager.

I didn't add the css file during the construction of the application.

When I click at the button , it will add a new css file "GeniePre.css" using useStyleSheet. I customed the style of Wt-tabs , so it conflicts with the internal css. But it was overwritten by the internal css file.

If I add the css file during the construction of the application , then it overwrites the internal css as expected.

Actions #3

Updated by Koen Deforche over 12 years ago

  • Status changed from Feedback to Resolved
  • Target version set to 3.2.1

Hey,

Indeed, for stylesheets added later, your analysis was correct. Somehow we never tested that scenario w.r.t. overriding the built-in stylesheet.

This has now been fixed in git.

As a workaround, you could consider to make the selectors that you override more specific, by prefixing them for example with "body ", so that they still take priority even if they are "up" in the document.

Regards,

koen

Actions #4

Updated by Koen Deforche almost 12 years ago

  • Status changed from Resolved to Closed

Fixed in 3.2.1

Actions

Also available in: Atom PDF