How to deal with web bugs and compatibility issues under different browsers

Source: Internet
Author: User

Typically, when you write a webpage, you view the page and make adjustments through Chrome or the Firefox browser. When this is done, it usually appears as normal under the browser, and there are some bugs when opened in other browsers.

Common bugs are in the following categories:


    1. The browser does not match the default initial values of some tags to cause display errors

      For example: IE does not recognize a:link tags, so when setting a tag property, use a {} instead of A:link {} to ensure that all browsers are recognized;

      Chrome for the non-specified font size of the Chinese character defaults think 12px, and Firefox is smaller than 12px, so the font size in each div is strictly defined;

      Different browsers have different default values for some colors, so these all need to be specified in CSS.


    2. No writing <!doctype>

      The compatibility problems caused by different doctype are serious, so it is important to specify a type of doctype before writing the content. See <! for details. The role of doctype>.


    3. Irregular writing, which causes different browsers to recognize inconsistencies

      such as IE 3 pixels margin bug: Two consecutive Div, the first to adopt the float, the second does not make provisions, then the IE display as two div side-by display, the middle of the 3px interval. So some front-end engineers directly use this to implement the element side-by-side display. But under other browsers, the second Div is under the first Div. The solution is to write the specification, and to achieve side-by-side display, two div will float.


    4. Bugs in the browser itself (usually IE6 and below)

      Usually the bug is basically caused by the above 3 kinds of reasons, the real browser bug is very few. The following are common:

      A. Box model bug, solution use strict DOCTYPE statement

      B. Double margin bug (left floating element, left margin is defined twice times), solution uses _display:inline, only IE browser is recognizable, does not affect other browsers.


With the browser version of the update, the different browsers produced less compatibility, is a good phenomenon for developers.

Web bugs, how to handle compatibility issues under different browsers

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.