About CSS3 common bug and hack

I, on the low version of IE bug and common hack

  1) picture frame has BUG

  When the picture and <a href="#"> </a> will border on IE

  Hack: Add to the picture border: 0; or border: 0 none;

img{
    border:0;
    display:block;
}

  2) Pictures gap

  div pictures gap bug, when you insert a picture in a div, the div below the picture will stretch about three pixels.

  hack 1: the </ div> and <img> written on one line;

  hack 2: The <img> into a block element to <img> Add the declaration: display: block;

  3) float to double (double margin) (IE6 will only appear)

  When ie6 and earlier versions of the browser parses the float, the float incorrectly displayed in double edge to the boundary.

  hack: Floating elements are added to the statement: display: inline;

  4) The default height (IE6, IE7)

  In the version of IE6 and below, some elements have a default block height (16px)

  hack 1: Add the declaration for element: font-size: 0;

  hack 2: Adding elements to declare: overflow: hidden;

Second, non-IE browser and HACK BUG

  5) form elements aligned inconsistency

  Inconsistent form high alignment element row

  hack: to add a declaration form element: float: left;

  6) elements of the default button sizes

    Each browser button element size is inconsistent

  hack 1: Uniform Size (marked with a tag)

  hack 2: input outside sets a label, written in the style of the buttons throughout tag, the input frame removed.

  hack 3: If this button is a picture directly to the picture as a background to a button

  7) the mouse pointer bug

  hand cursor property value property only IE9 browser identification in the following, other browsers do not recognize the declaration, the pointer cursor property attribute values ​​IE6 or later kernel and other browsers recognize change statement

  hack: an element such as a mouse pointer uniform shape handedness

  Statement should be added: cursor: pointer

  the Cursor: Auto Default / Crosshair plus / t EXT text / the wait wait / Help Help / Progress process / the inherit succession / the Move mobile / ne-up of a resize or move right / pointer-hand

  8) Transparent property

  Compatible with other browsers wording opacity: value; (the range value of 0-1;)   

  IE browser wording: filter: alpha (opacity = value); in the range 1-100

 

 

Guess you like

Origin www.cnblogs.com/shewill/p/12504332.html