skip to Main Content

Not sure whether this is correct platform to ask this question but I was recently inspecting Instagram web page and found that all css classes were appeared to be some random characters for example take a look at this element

<div class="x9f619 x1n2onr6 x1ja2u2z">
    <div class="x78zum5 xdt5ytf x1n2onr6 x1ja2u2z">
       <div class="x78zum5 xdt5ytf x1n2onr6">
       </div>
    </div>
</div>

I was even surprised to see not even in dev tools section I was able to see any CSS values like color etc

is there any way we can achieve similar behavior of hiding HTML and CSS if yes then how?

2

Answers


  1. It’s just a randomly generated class name at build time.

    You can learn more about webpack.js, and its style-loader

    webpack-style-loader

    Login or Signup to reply.
  2. To answer your question – you can’t hide CSS class names upon inspection. CSS classes are there to apply the styling. You can use compilers and UI frameworks that generate random looking CSS names, or inline the CSS on the HTML elements.

    You can see the styling each of those class names add to the elements in the Dev Inspector. enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search