How to assign CSS class with custom name to component

I want to create custom CSS class for row (CSS class name = intro_row).

  1. Choose "Style attribute" dropdown in "Options"
  2. Choose "Create CSS Block...".
  3. Rename standard ".row" class name to ".intro_row".
  4. Make another changes inside .intro_row
  5. Look at design region - nothing changed.
  6. Look at "Style attribute" dropdown - no .intro_row.
  7. Look at HTML - row div has no CSS class attribute at all.

So, how to assign CSS class with custom name to component? I'm against usage of default .row CSS because every row on page changed by these changes.

Sorry, I did not find Attributes panel under HTML panel. Please ignore the question

You can also do it how you were doing it, just don't "change" the .row, add "to" the .row so it would be: .row .intro-row

add your attributes to the Class in the Styles window for that .intro-row and you should be all set then. Basically a few ways different ways to do the same thing. I personally prefer to use the attributes box in the HTML window, quicker and easier and less confusing as you won't accidentally end up with classes inline as much as you would by using the new Options area for classes.