CSS Pro
  • Initial page
  • Quick Start
    • Installing it
      • On Google Chrome
      • On Firefox
      • On Safari
  • Inspecting
    • Choosing what happens when you click on an element
    • Inspecting invisible, overlapping, and parent elements
    • Comparing multiple elements at the same time (Pinning)
    • Measuring distances and checking alignments
    • Inspecting animations
    • Identifying fonts
  • Editing
    • Code Editor (Code tab)
      • Forcing a state or pseudo
    • Visual Editor (Design tab)
      • Editing media queries and pseudo states
      • Editing backgrounds
      • Auto unit conversion
    • HTML Editor (HTML tab)
    • Handling CSS changes
    • Editing texts
    • Removing elements
  • Copying
    • Copying CSS and HTML
    • Exporting elements
    • Downloading page assets (images)
    • Copying colors
  • License
    • Managing your license activations
    • Retrieving your license key (forgot)
  • Subscription
    • Switching from the monthly to the annual plan
    • Canceling your subscription
Powered by GitBook
On this page

Was this helpful?

  1. Editing
  2. Code Editor (Code tab)

Forcing a state or pseudo

PreviousCode Editor (Code tab)NextVisual Editor (Design tab)

Last updated 3 months ago

Was this helpful?

When editing pseudo-classes such as :hover, you won't see the changes in real-time unless you perform that interaction (for :hover, for example, you'd have to hover over the element).

For that, you can force toggle a state or pseudo with CSS Pro by clicking on the "eye" button on the right corner of the state/pseudo:

Click on the eye to toggle the pseudo ON/OFF