Cross-Browser

This article is missing the following important information:

  • Media other than the PC screen (paper, PDA, mobile phone, ...)
  • Compatibility with standards, accessibility
  • HTML as a logical markup language
  • Paternalism of the user?
  • Web standards ( W3C Validator)

Cross - browser refers to the ability of embedded in websites content thereof (including Cascading Style Sheets ( CSS), and JavaScript), regardless of the type of browser and operating system used to produce the same output or to behave largely identical.

Compliance with web

The need for cross-browser capabilities has grown historically and is derived in part of the time the browser war between Microsoft and Netscape, and partly due to differing interpretations of various standards in leading browsers. In addition, the desire of many web designers and developers plays a major role by pixel-precise positioning of individual elements.

Problem

The results are web pages that provide only on certain browsers the desired result, while they have unsightly display errors on the browser of a different make or do not work at worst.

As a consequence, web designers must strive to keep their content on all major browsers run, which can be a time-consuming task by trial - and - error method sometimes.

View

With the DOM, a standard object model of the W3C, a significant step in a uniform direction was gone, but there are strong differences and shortcomings especially in the coding of events (see Quirksmode ).

Examples

To understand the following code examples, basic knowledge of HTML and JavaScript are required:

sample text The code describes a block of text that should be 100 pixels displayed in the upper left corner of the web from the top and 100 pixels left margin. In the browsers, the Series 4 of Netscape Navigator could move this block of text with JavaScript later:

Document.layers [ 'sample '] left = 200. ; This code, however, would 4 not work in Internet Explorer. Instead, you would have to use the following notation:

Document.all [ 'sample '] style.left = 200. ; To make the code cross-browser -compatible, so it should look like this:

If ( document.all )    document.all [ 'sample '] style.left = 200. ; else if ( document.layers )    document.layers [ 'sample '] left = 200. ; The following code uses the DOM, a standard model of the W3C that is supported by all modern browsers (eg Mozilla Firefox, Internet Explorer, Opera, Safari, etc.):

Document.getElementById ( 'sample ') style.left = '200px '. ; Cascading Style Sheets

The following code creates a minimum amount in block elements:

sample text The Internet Explorer up to version 6 interprets the specified min-height incorrectly or not at all, which is why the size of the element depends on the content in these browsers.

The following information describes the size and spacing of a div element:

sample text Again, the Internet Explorer due to the box model bugs the div element does not display correctly when the document is rendered in quirks mode: Contrary to the specification, the total width of the affected browsers 200 pixels (correct would be an element of the total width of 230px ).

Browser wars Webmaster Document Object Model Internet Explorer box model bug
208044
de