It supports javascript but the problem is the whole thing is refreshed for every character you type. Example, adding "alert('foo')" will give you an alert for every character you type in the edit box.
Am I doing it wrong or is this supposed to happen? It could probably do with a run button like JSFiddle.
When margin top or bottom is a percentage, it refers to the width, not height, of the containing block. If the parent is 100% width (say, the body), the element will move down 50% of your screen width.
Usually, you don't want this, but you can use it to do some cool tricks with keeping the aspect ratio of an element, like this: http://jsfiddle.net/bgrins/999FP/
I thought this was just a JSFiddle/JSbin type site for CSS but then I clicked on the generated HTML and realized what it lets you do. This looks like a great tool for learning CSS but I can't imagine myself pasting in some HTML/CSS and tweaking one thing at a time by pointing and clicking.
I'd still recommend checking out http://jsfiddle.net which lets you keep JS, HTML and CSS separate and makes it easy to include specific versions of JS libraries (handy for testing/reporting bugs). There's also a nice embeddable (iframe) version and it lets you test ajax responses. There's also http://jsbin.com which has similar features.
Seems similar to http://webputty.net , though WebPutty has CSS hosting, better integration with existing sites, and compatibility with SCSS.
That aside, what problem do you see this as solving? As in, why would somebody learning CSS by "playing around" (as you say on your About page) want to use LabCSS instead of Firebug or the Chrome debugger?
First of all, webputty will not always be free.
Second thing is, webputty is a website for CSS manipulation, whereas labcss is a snippet website for creating styled HTML elemments. The process of building the website is the significat advantage of this website, and not only the CSS tweaking.
24 comments
[ 3.7 ms ] story [ 96.8 ms ] threadAm I doing it wrong or is this supposed to happen? It could probably do with a run button like JSFiddle.
Along with the selectors on the left and all the nice sliders, you can try out a lot of stuff really quickly.
Nice tool though. Easy to try out quick changes fast.
When margin top or bottom is a percentage, it refers to the width, not height, of the containing block. If the parent is 100% width (say, the body), the element will move down 50% of your screen width.
Usually, you don't want this, but you can use it to do some cool tricks with keeping the aspect ratio of an element, like this: http://jsfiddle.net/bgrins/999FP/
:(
I'd still recommend checking out http://jsfiddle.net which lets you keep JS, HTML and CSS separate and makes it easy to include specific versions of JS libraries (handy for testing/reporting bugs). There's also a nice embeddable (iframe) version and it lets you test ajax responses. There's also http://jsbin.com which has similar features.
That aside, what problem do you see this as solving? As in, why would somebody learning CSS by "playing around" (as you say on your About page) want to use LabCSS instead of Firebug or the Chrome debugger?
Uncaught SyntaxError: <unknown message reserved_word> in HTMLFiddle.js:87