Is it possible to ignore CSS with a style or script?

Question

We are using a shared platform for our website, so we don't have access to the base HTMl and CSS for the site, as it is global for all of their customers.

Currently, when you go to a brand page, you get the logo and a Read More link which expands the top area of the page and displays all of the about the brand information.

I really want to display this area by default and optionally hide it, if possible. Otherwise, just display it. But since I can't get to the base code, I can't figure out how to do it.

While I can't get to the CSS for the page/site, I can use styles or scripts.

Can anyone help? Here's a bit of the code. Essentially, I want the "read more" to go away and display the hidden stuff by default. I just can't get to the base code to do it. I hope that makes sense.

<div class="show-read-more">
                <strong>About:</strong><br>
         ******* STUFF GOES HERE THAT'S HIDDEN NOW ******

<span class="read-more-span">
<a href="javascript:void(0)" class="read-more">Read More</a>
</span>

Adding the question again will not help. Plz, provide the link of the website. — Manas Khandelwal, Feb 03 '21 at 14:32
You could maybe use your own css to override the default styling. using `!important` should override it. — Davedude, Feb 03 '21 at 14:36

score 0 · Answer 1 · answered Feb 03 '21 at 14:44

The general solution would be

Make a XMLHttpRequest to the platform
Use DOMParser() to load the platform as DOM
Manipulate the loaded DOM as you wish (add/remove styles or elements)
Display the altered DOM

If the platform has some CORS protection (so the XHR won't pass), you will probably need to make CURL request from your backend.

Is it possible to ignore CSS with a style or script?

1 Answers1