How can I use development tools to find css class of a plugin item


Tags: css,google-chrome-devtools

Problem :

I have this small technical question about using development tools such as firebug or google chrome D.T. in finding css class

that lets say I have a plugin and would like to know a css class to modify it, how can I do that using the Development tools ?

thanks a lot in advance ... and excuse me :) I am little bit newbie :D



Solution :

Not sure what kind of plugin you have, but if it is a simple <div> in your HTML, just right click on it and select "Inspect Element" (in Chrome with dev tools, there is something similar in Firefox) which will show you the HTML as it is right now even after some JavaScript library might have added some dynamic content. So this will show you also the css class of the elements. On the right, you will also see which parts of CSS are active for this element. That also shows you the css classes (including classes from parent containers).


    CSS Howto..

    How to fade text out vertically, similar to Amazon's product descriptions

    How to make a CSS mega menu be on the full width of the page? (998px, but in the middle?)

    how to write set of styles as a function in compass sass

    How Float divs like twitter?

    How can I override an inline style with an external css?

    How do I override inline CSS with Class CSS? [duplicate]

    How to understand CSS Background-Position coordinates

    How do I stick my footer to bottom of the page with Google Chrome?

    How to include border-radius.htc in MVC architecture to make border-radius work in IE

    Gulp : How to copy multiple files and keep the folder structure

    How do I float a div to the right of a title div without affecting the content of the title?

    How to make a condition in CSS with an HTML attribute?

    How to detect all events added on a div

    HTML - How do css/javascript files get loaded?

    How can I style a select option like a table?

    How to CSS Img Border on Hover without Shifting Image

    How to filter HTML elements based on their css attribute values ? [closed]

    How to silently hide “Image not found” icon when src source image is not found

    How to position div which contains font-awesome icons to centre of another div?

    Bootstrap table table-condensed table-hover, Top Border not showing

    How to make a paragraph appear in a certain area in the page using Wordpress?

    how to add style to form under echo statement by css [closed]

    How to “crop” a rectangular image into a square with CSS?

    How to apply a CSS class to another element when an object is hovered?

    CSS: How to vertically align elements inside div with display: table-cell

    Animated HTML,CSS JavaScript. How can I implement this [closed]

    How to prevent outside CSS from adding and overriding ReactJS component styles

    How to target the first-child of an optgroup with css or jquery

    How can I create the shape of side mirrors of a truck/lorry?

    How do I stylize ::selection in IE8? [duplicate]