How can I use Visual Aids in Microsoft Expression Web 2?

Visual Aids in Microsoft Expression Web 2 help you with these

1.       See elements that are empty, invisible or with hidden border and styles.

2.       ASP.NET non-visual controls and errors.

3.       Size of margins and padding around your tags.

4.       Determine which tags are written around specific content in your page.

To show or hide a Visual Aid;

·         Go to View > Visual Aids and then choose a Visual Aid or

·         On the Status Bar right click on Visual Aids and then click on the Visual Aid.


Let us take a closer look at all the Visual Aids:

1.       Block Selection= This is enabled by default. Expression® Web displays a block selector for HTML blocks. A Block selector is a small tag indicator, when you hover over your cursor in a block a dotted rectangle appears around the tag. When you select the block a shaded area is displayed indicating padding around the element.

2.       Visible Borders= This selection displays dotted borders around HTML elements that don’t have borders. For instance, a table in Expression® Web, Visual borders will render a dotted border around every cell even if the table has no border.

3.       Empty Containers= The Empty Containers Visual Aid displays borders around certain elements that act as containers for other elements. For example, an HTML form is visible by default in Design View, even when the form has no controls in it.

4.       Margins and Padding= This shows the margins and padding around all elements; margins appear in red and padding appears in blue. You cannot use Margins and padding visual aid to change margins and padding.

5.       CSS Display: none elements= Shows elements that are hidden by a style that includes display: none.

6.       CSS Visibility: hidden Elements = Shows elements that are hidden by a style that includes visibility: hidden.

7.       ASP.NET Non-visual Controls= Shows a rectangle for ASP.NET controls which don’t display anything.

8.       ASP.NET Control Errors= Shows an error message when an ASP.NET control encounters an error, such as not connecting to a data source.

9.       Template Region Labels= Shows a border around editable template regions, including a tab with the name of the region, in pages based on Dynamic Web Templates or ASP.NET master pages.

Filed Under: Expression Web


About the Author: Minal is a freelance web and graphics designer. She specializes in designing Logos, Stationery, Graphics and Icons as well as website templates using graphical tools like Photoshop, Illustrator and Expression Web. Twitter @saffronstroke

RSSComments (0)

Trackback URL

Leave a Reply