How to make a stable two column layout in HTML/CSS

Here you go: <html> <head> <title>Cols</title> <style> #left { width: 200px; float: left; } #right { margin-left: 200px; /* Change this to whatever the width of your left column is*/ } .clear { clear: both; } </style> </head> <body> <div id=”container”> <div id=”left”> Hello </div> <div id=”right”> <div style=”background-color: red; height: 10px;”>Hello</div> </div> <div class=”clear”></div> … Read more

Are single/double quotes allowed inside HTML attribute values?

Yes, both quotes are allowed in attribute values, but you must HTML-escape the quote you’re using as an attribute value delimiter, as well as other HTML-special characters like < and &: function encodeHTML(s) { return s.split(‘&’).join(‘&amp;’).split(‘<‘).join(‘&lt;’).split(‘”‘).join(‘&quot;’).split(“‘”).join(‘&#39;’); } var html=”<label my_attr=””+encodeHTML(attr_value)+'”>Text</label>’; However, you are usually much better off not trying to hack a document together from … Read more

multiple selections with datalist

Multiple currently working only with input type=”email” and only in Chrome and Opera Look at this minimalist example: input{width:500px} <input type=”email” list=”emails” multiple> <datalist id=”emails”> <option value=”[email protected]”> <option value=”[email protected]”> <option value=”[email protected]”> <option value=”[email protected]”> </datalist> <br><br><br> <input type=”text” list=”texts” multiple> <datalist id=”texts”> <option value=”black”> <option value=”gold”> <option value=”grey”> <option value=”pink”> <option value=”turquoise”> <option value=”red”> <option value=”white”> … Read more

Using local file for Web Audio API in Javascript

I had the same problem and I found this very simple solution. audio_file.onchange = function(){ var files = this.files; var file = URL.createObjectURL(files[0]); audio_player.src = file;; }; <input id=”audio_file” type=”file” accept=”audio/*” /> <audio id=”audio_player” /> You can test here:

How can I style a file input field in Firefox?

Many of the answers above are quite old. In 2013 a much simpler solution exists: nearly all current browsers… Chrome IE Safari Firefox with a few-line fix pass through click events from labels. Try it here: Style the <label> however you you would like your file upload to be. Set for=”someid” attribute on the … Read more