new features
version comparison
features: php tools
php debugger
php profiler
php frameworks
php scripts
features tour
php testing
PhpED difference
PhpED on Mac/Linux

CSS Code tree in Code Navigator

In addition to PHP mode and HTML mode available in PhpED's Code Navigator NuSphere's PHP IDE also provides CSS mode for code navigation. CSS Code tree combined with CSS Preview feature provides for easy CSS Editing.

CSS Code tree display

When the CSS file is loaded in the editor Code Navigator tab automatically switches to CSS mode. You can also always select CSS mode of the navigator for any file loaded in the editor. In this mode it displays the tree of CSS styles and elements defined in the file. The bottom part of the Navigator displays the properties of the selected CSS style. For example, this picture shows the CSS Code Navigator for NuSphere home page: CSS Code Navigator

CSS Code tree navigation

CSS Code tree allows you to navigate easily through CSS code in any file. CSS Code Navigator Tool bar provides the means to configure the display of and navigation inside of the CSS code:

  • Search.
    Similar to the way it works in PHP Code Navigator it performs search in the elements and styles of the CSS tree on the text typed in the input field.
CSS Code search
  • Track Current position.
    When this option is turned on and you move the cursor in the editor, the CSS Code navigator highlights the tree element corresponding to the current position of the cursor
CSS Code track
  • Select button.
    When you press this button, the code corresponding to the current CSS Tree element or style gets selected in the editor.
CSS Code select
  • Go To Definition.
    Pressing this button positions the cursor in the editor on the CSS code corresponding to the current element of CSS tree, as it shown in the example.
The same behavior happens on double clicking of the CSS tree elements
CSS Code Definition
  • CSS View Settings: Group Selectors.
    When Group Selectors item is checked CSS navigator groups CSS code into Elements, Classes and IDs and displays them on separate branches of the tree. In this mode selection with Select button will highlight only the name of the selected element.
CSS Code Navigator Grouped
  • With Group Selector unchecked, CSS code navigator displays all elements on one branch and select highlites the entire body of the selected element:
CSS Code Navigator UnGrouped

CSS Code navigator is only one of the many CSS Editor Tools available in PhpED along with PHP Editor Tools, and HTML Editor Tools such as HTML code folding and HTML Preview. You can see these tools in action when you Download a free trial of NuSphere's PHP IDE today!

 Download NuSphere PHP IDE

Download a free trial of the fast PHP EDitor and robust Integrated Development Environment for PHP.

 Buy NuSphere PhpED® now

Best PHP Editor and complete PHP IDE.
NuSphere PhpED 21.0 is available from our online store front.
"To be honest its bloody awesome, I have looked at loads of PHP editors and this is THE only one that actual works straight out of the box!!! Brilliant, well done."
Andrew Breward,
Director of Technology


Walk through NuSphere PhpED interface
PhpED video tutorial: Webservices
Learn how to add webservices to your code in less than 5 minutes (a flash demo).

 Special Team4 Offer

Get 4 copies of PhpED for the price of 3!

Optimum solution for development teams.
PhpED 21.0 Team4
Need more than 4 licenses? Contact Us for more quantity discounts, please use "Ordering/Payment issue" subject on the form.

 Dr. Dobb's

Dr. Dobb's

Dr. Dobb's Magazine covers NuSphere PhpED in New and Noteworthy section.

PhpED is a proper, world-class IDE for PHP code. It is the only IDE worth considering if PHP development is your primary job