Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

custom css not working

See original GitHub issue


It seems that custom css in the nodetemplate is not being applied.

Minimal example:


<div class="default-node functionnode @(Node.Group != null ? "grouped" : "") @(Node.Selected ? "selected" : "")" style="width: 250px; background-color: @Node.Function.Color">
    @foreach (var port in Node.Ports.Cast<FunctionPortModel>())
        <PortRenderer Port="port" Class="functionport">@port.Connector.Name</PortRenderer>

@code {
    public FunctionNode Node { get; set; }

As you can see I’m adding class functionport on the PortRenderer. It is defined in the component’s stylesheet:


.functionport {
    padding: 5px;
    margin: -18px;
    border-radius: 50%;
    background-color: #f5f5f5;
    border: 1px solid #d4d4d4;
    cursor: pointer;
    position: absolute;

It does not get applied at runtime. Moving the class to app.css doesn’t work either. Am I doing something wrong?

Thank you

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:6

github_iconTop GitHub Comments

BjornEngelencommented, Feb 2, 2021

After some fumbling around it seems !important is doing the trick. I guess I’m just having some sort of precedence-issue, and there is no issue with your library. I think we can close.

Thanks for your work and this utility

zHaytamcommented, Feb 2, 2021

So technically, the CSS is working. If you inspect your node’s ports, they aren’t styled at all? Maybe it’s just not visible (since it’s only 5px padding)? What if you put your css (without the deep thing) on a global css file (no CSS isolation) and see if that works?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Why my Custom CSS doesn't work? - WordPress Websites ...
Here are the most common mistakes causing the custom CSS doesn't work: · Inspect the element! First of all, make sure you have...
Read more >
Why Your Custom CSS Doesn't Work in WordPress and How ...
Fortunately, it's fairly easy to find and diagnose the problem. Go to any page on your site and, in Chrome, right-click and select...
Read more >
Customizing Additional CSS not working
I'm adding additional CSS in the regular WP customizer, but it does not effect the page on the right. But, if I Publish...
Read more >
My Custom CSS Isn't Working
Why the custom CSS code is not getting applied · 1. Syntax Errors. Reason: CSS code has syntax errors. Fix: Make sure that...
Read more >
Custom CSS class not working
Try the key-combination CTRL (CMD on mac) + SHIFT + R, or CTRL + F5 for IE. This will clear your local cache...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found