Unable to add inline CSS styles to html tags

In the ck-editor we have source button.

Please click on source and add the markup in the body field.

Please check screenshots.

Hi Ravi4All,

Just reviewed your issue. I installed 8.4 and tried reproducing your issue. But everything worked fine for me.

Guess you have placed the content <div style="background: #1a646c; padding: 15px; display: inline-block;">Click Here</div> in the body directly. But you need to place it after selecting the "Source" icon in the editor and need to place your content and then save it.

This works fine for me.

Also tried, can confirm #3 and #4: this works fine. It's important that you use the Full HTML text format though, otherwise style attributes are not allowed!

This is still happening with 8.8.1.

I have added the following to the list of allowed tags <div> <div style>.
After saving the node, the <div> stays but the "style" is removed.

This issue mentions that it may be CKEditor and its Advanced Content Filter stripping the "style."

However, an answer to this Stack Exchange question says that it's the XSS filter in Drupal.

I checked FilterHtml.php and the <div style> doesn't survive the code below, so it is indeed Drupal. $class becomes Drupal\Component\Utility\Xss.

    $class = get_called_class();
    $splitter = function ($matches) use ($html_tags, $class) {
      return $class::split($matches[1], $html_tags, $class);
    };
    // Strip any tags that are not in the whitelist.
    return preg_replace_callback('%
      (
      <(?=[^a-zA-Z!/])  # a lone <
      |                 # or
      <!--.*?-->        # a comment
      |                 # or
      <[^>]*(>|$)       # a string that starts with a <, up until the > or the end of the string
      |                 # or
      >                 # just a >
      )%x', $splitter, $string);

Digging a little further, it's actually the attributes() function in Xss.php removing the attributes.

I don't have a good workaround yet.

I also just ran into this issue. The reason it gets removed is that xss always removes "style" and "on"

$skip = ($attribute_name == 'style' || substr($attribute_name, 0, 2) == 'on');

Use case: User gets an embed code from a 3rd party and wants to paste it on the site. This code contains inline styling that differs by embed.

IMO Ideal state I should be able to define what styles are allowed. To get around this limitation my options are:
- Add a hook call in the XSS class to be able to alter the skipped properties
- Turn XSS into a service and override it.

Note this is NOT ckeditor specific, this is in a text format with no wysiwyg. I'm curious about people's thoughts on this.

Just encountered the same issue but not through Ckeditor, by using Tokens and webform

A code like this doesn't keep the style attribute but it does keep the href.

      $text = '<a href="#" style="color: blue;">Download</a>';
      $simple = [
        '#markup' => $text,
      ];
      $render = render($simple);

Result:
<a href="#">Download</a>

The problem happens also with custom data attributes.

EDIT: For those who have a problem with webform, the module allows you to use format_text instead.
/admin/structure/webform/config/elements
Element text format: FULL HTML

The issue is present in 8.9.3.

Inline css is filtered out when "Limit allowed HTML tags and correct faulty HTML"is set and within the "Allowed HTML tags" style is added to <img> so it looks like <img src alt style data-entity-type data-entity-uuid data-align data-caption>. The style is still filtered out.

I can also reproduce this bug in a views header will Full HTML filter, but only when "Use replacement tokens from the first row" is enabled. Style attributes are stripped, but disable first row tokens, and they are no longer stripped. Related open issue here
https://www.drupal.org/project/drupal/issues/3109650

Same problem on basic html, I have add sth like to "Allowed HTML tags", but didn't work
Ps: Drupal9.07