Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Inlined CSS styles remove the classes so responsive CSS doesn't work #4816

Open
jkupczak opened this issue Sep 10, 2024 · 0 comments
Open

Inlined CSS styles remove the classes so responsive CSS doesn't work #4816

jkupczak opened this issue Sep 10, 2024 · 0 comments

Comments

@jkupczak
Copy link

jkupczak commented Sep 10, 2024

Expected behavior.

Responsive CSS should be able to target elements using classes.

Actual behavior.

Because styles are being inlined, classes are being removed from elements which causes responsive CSS code to no longer work.

Steps to reproduce the problem.

Use the following code in the editor. In my case the code changes after the code is rendered.

The following code is what I enter into the editor.

<!DOCTYPE html>
<html>
	<head>
		<style>
			.main { 
			background:green 
			}
			@media only screen and (max-width: 657px) {
				.main { background:red }
			}
		</style>
	</head>
	<body>
		<div class="main">
			Oh hai mark
		</div>
	</body>
</html>

Then it's rendered as this:

<!DOCTYPE html><html><head><style>
			.main { 
			background:green 
			}
			@media only screen and (max-width: 657px) {
				.main { background:red }
			}
		</style></head><body aria-disabled="false">

<div fr-original-style="" fr-original-class="main" style="background: green;">
Oh hai mark
</div>
</body></html>
Editor version.

I don't know it. I'm an end user.

OS.

MacOS Ventura 13.2.1

Browser.

Google Chrome 127.0.6533.101

Is there a workaround for this? I don't have access to edit anything on the backend so I'm hoping there's a way to prevent this from happening strictly using HTML.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant