Adobe

Check for cross-browser CSS rendering issues


 
By clicking Submit, you accept the Adobe Terms of Use.
 

  • Run a browser compatibility check
  • Select the element affected by a found issue
  • Jump to the next or previous found issue in the code
  • Select browsers for Dreamweaver to check against
  • Exclude an issue from the browser compatibility check
  • Edit the Ignored Issues list
  • Save a browser compatibility check report
  • View a browser compatibility check report in a browser
  • Open the Adobe CSS Advisor website

The Browser Compatibility Check (BCC) feature helps you locate combinations of HTML and CSS that have problems in certain browsers. When you run a BCC on an open file, Dreamweaver scans the file and reports any potential CSS rendering issues in the Results panel. A confidence rating, indicated by a quarter, half, three-quarter, or completely filled circle, indicates the likelihood of the bug’s occurrence (a quarter-filled circle indicating a possible occurrence, and a completely-filled circle indicating a very likely occurrence). For each potential bug that it finds, Dreamweaver also provides a direct link to documentation about the bug on Adobe CSS Advisor, a website that details commonly known browser rendering bugs, and offers solutions for fixing them.

By default, the BCC feature checks against the following browsers: Firefox 1.5; Internet Explorer (Windows) 6.0 and 7.0; Internet Explorer (Macintosh) 5.2; Netscape Navigator 8.0; Opera 8.0 and 9.0; Safari 2.0.

This feature replaces the former Target Browser Check feature, but retains the CSS functionality of that feature. That is, the new BCC feature still tests the code in your documents to see if any of the CSS properties or values are unsupported by your target browsers.

Three levels of potential browser-support problems can arise:

  • An error indicates CSS code that might cause a serious visible problem in a particular browser, such as causing parts of a page to disappear. (Error is the default designation for browser support problems, so in some cases, code with an unknown effect is also marked as an error.)

  • A warning indicates a piece of CSS code that isn’t supported in a particular browser, but that won’t cause any serious display problems.

  • An informational message indicates code that isn’t supported in a particular browser, but that has no visible effect.

Browser compatibility checks do not alter your document in any way.

    To the top

    Run a browser compatibility check

     Select File > Check Page > Browser Compatibility.
    To the top

    Select the element affected by a found issue

     Double-click the issue in the Results panel.
    To the top

    Jump to the next or previous found issue in the code

     Select Next Issue or Previous Issue from the Browser Compatibility Check menu in the Document toolbar.
    To the top

    Select browsers for Dreamweaver to check against

    1. In the Results panel (Window > Results), select the Browser Compatibility Check tab.
    2. Click the green arrow in the upper-left corner of the Results panel and select Settings.
    3. Select the checkbox next to each browser you want to check against.
    4. For each selected browser, select a minimum version to check against from the corresponding pop‑up menu.

      For example, to see if CSS rendering bugs might appear in Internet Explorer 5.0 and later and Netscape Navigator 7.0 and later, select the checkboxes next to those browser names, and select 5.0 from the Internet Explorer pop‑up menu and 7.0 from the Netscape pop‑up menu.

    To the top

    Exclude an issue from the browser compatibility check

    1. Run a browser compatibility check.
    2. In the Results panel, Right-click (Windows) or Control-click (Macintosh) the issue that you want to exclude from future checking.
    3. Select Ignore Issue from the context menu.
    To the top

    Edit the Ignored Issues list

    1. In the Results panel (Window > Results), select the Browser Compatibility Check tab.
    2. Click the green arrow in the upper-left corner of the Results panel and select Edit Ignored Issues List.
    3. In the Exceptions.xml file, find the issue that you want deleted from the Ignored Issues list and delete it.
    4. Save and close the Exceptions.xml file.
    To the top

    Save a browser compatibility check report

    1. Run a browser compatibility check.
    2. Click the Save Report button on the left side of the Results panel.
      Hover over buttons in the Results panel to see button tool tips.
      Note: Reports are not saved automatically; if you want to keep a copy of a report, you must follow the above procedure to save it.
    To the top

    View a browser compatibility check report in a browser

    1. Run a browser compatibility check.
    2. Click the Browse Report button on the left side of the Results panel.
      Hover over buttons in the Results panel to see button tool tips.
    To the top

    Open the Adobe CSS Advisor website

    1. In the Results panel (Window > Results), select the Browser Compatibility Check tab.
    2. Click the link text at the bottom right of the panel.
    More Help topics

    Validate XML documents

    CSS Advisor

    Legal Notices   |   Online Privacy Policy