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. Visual Editor (Design tab)

Editing media queries and pseudo states

When editing in the Visual Editor, you can choose to edit specific media queries and/or pseudo-classes and pseudo-elements such as :hover, :before, etc.

PreviousVisual Editor (Design tab)NextEditing backgrounds

Last updated 5 months ago

Was this helpful?

When selecting media queries, you can choose:

  • None (the default state of the element)

  • Auto (the last currently matched media query - updates itself automatically depending on your browser's window size)

  • Suggested (suggested breakpoints by CSS Pro) - mobile first and then desktop first

  • or custom (simply type on the input to create any media query you want)

When selecting state or pseudo, it shows some options for the specific element, but you simply type on the input to edit any pseudo you want.

Choosing a media query to edit in the Visual Editor
Choosing a pseudo-class to edit in the Visual Editor