This article will teach you how safari on ipad IOS6 does not scale HTML5 video To fill 100% of page widthOn a responsive HTML5 page, a video can be shown at full width (100%) by applying the following CSS. The video's native resolution is 480x270. On all desktop browsers, the video is resized to span the entire width of the page while preserving the aspect ratio. On the iPad (iOS 6.0.1), Mobile Safari and Chrome, however, display a black rectangle same width as the page. The black rectangle's centre contains a little video that is shown at its original resolution ... Read More

The flex property is a shorthand for the flex-grow, flex-shrink, and flex-basis properties. The flex property sets the flexible length on flexible items.For example −#container article {    -webkit-flex: 1 1 auto;    overflow-y: auto;    height: 0px; /*here the height is set to 0px*/ }If you want a min-height, the use height: 100px; that it is exactly the same as − min-height: 100px;#container article {    -webkit-flex: 1 1 auto;    overflow-y: auto;    height: 100px; /*here the height is set to 100px*/ }

The following is the correct way −ExampleHere is an example −           Checkbox Control                         Maths           Physics            

The parent object provides a reference to the main window from the child.The following is the parent code. The directive below triggers the iFrame to send a message to the parent window every 3 seconds. No initial message from the main window needed!var a= window.addEventListener ? "addEventListener" : "attachEvent";// here a is the event method var b= window[a];// here b is the eventer var c= a== "attachEvent" ? "onmessage" : "message";// here c is the message event // Listen to message from child window b (c, function(e) {    var d= e.message ? "message" : "data";// here d is ... Read More

Giving a meta tag attribute "user-scalable=no" will restrict the user from zooming elsewhere.  Prevent zooming all together by adding this meta tag to your head tag. This tells the mobile browser to use the same width scale and will not allow the user to zoom in at all, hence also disables that annoying behavior. However, some might argue that this is not a very user-friendly way to handle the problem.The element, used along with one or more elements, creates a drop-down list of options for a web form. The element creates the list and each element is ... Read More

HTML is expressed as SGML and XHTML is expressed in XML. Creating XHTML is connected with more restrictions in the form of markup.Avoid using the or tags in XHTML 1.0 Transitional, as those are not an element of that specification.Convert from HTML to XHTMLAdd an XHTML to the first line of every pageAdd a xmlns attribute to the HTML element of every pageChange all element names to lowercaseClose all empty elementsChange all attribute names to lowercaseQuote all attribute values

To get the pixel color from canvas, use the following code. This returns the color in rgba −var index = (Math.floor(y) * canvasWidth + Math.floor(x)) * 4 // color in rgba var r = data[index] var g = data[index + 1] var b = data[index + 2] var a = data[index + 3]

To show it, use the following −You can also go for CSS −input[type="date"]::before{    color: #ffffff;    content: attr(placeholder) ": "; } input[type="date"]:focus::before {    content: "" !important; }

The autofocus attribute is a boolean attribute. When present, it specifies that an element should automatically get focus when the page loads. An example is given below                    First Name:          Last Name:                    

The putImageData() method places the image data onto the canvas. To animate canvas, we create a reusable ImageData object outside the main loop,var ct = c.getContext("2d", {alpha: false});       // context without alpha channel. var a = ct.createImageData(c.width, c.height);   var buffer = new Uint32Array(a.data.buffer);   function loop() {    noise(ct);    requestAnimationFrame(loop) })() function noise(ct) {    var l =buffer.length - 1;    while(l--) buffer[l] = Math.random() >0;    ct.putImageData(a, 0, 0); }