This month
From “Mobile Friendly” to “Mobile First” - The Easy Designs Blog
using min-width values rather than the max-width ones we’d been using previously to skrink the site
December 2011
Sprite Cow - Generate CSS for sprite sheets
by Spone & 3 others
Sprite Cow helps you get the background-position, width and height of sprites within a spritesheet as a nice bit of copyable css.
How design could save the W3C — an article by Ben Schwarz
by Monique
While preparing my HTML workshop, I’ve been re-reading W3C specs in far further detail than I ever would’ve imagined. The reading experience is far from delightful. Not only is the text the entire browser width in measure, but it’s dense and laborious to read. No wonder browser vendors have traditionally missed subtle details.
AdaptiveSlides.js · Responsive jQuery slideshow
by Spone
AdaptiveSlides.js is a tiny jQuery plugin that creates a responsive slideshow using images inside a single container. It work with wide range of browsers including all IE versions from IE6 and up. It also adds css max-width support for IE6 and other browsers that don't natively support it. Only dependency is jQuery and that all the images are same size.
November 2011
iScroll 4
by srcmax & 1 other
iScroll 4 is a complete rewrite of the original iScroll code. The script development began because mobile webkit (on iPhone, iPad, Android) does not provide a native way to scroll content inside a fixed width/height element. This unfortunate situation prevents any web-app to have a position:absolute header and/or footer and a scrolling central area for contents.
September 2011
August 2011
Techniques For Gracefully Degrading Media Queries - Smashing Magazine
by Monique
CSS3 media queries, which include the browser width variable, are supported by most modern Web browsers. Mobile and desktop browsers that lack support will present a subpar experience to the user unless we step up and take action. I’ll outline some of techniques that developers can follow to address this problem.
June 2011
Columnizer jQuery Plugin
by jpcaruana & 4 others (via)
The Columnizer jQuery Plugin will automatically layout your content in newspaper column format. You can specify either column width or a static number of columns. And, of course, it’s easy to use!
FitText - A plugin for inflating web type
by jpcaruana & 5 others (via)
FitText makes font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.
May 2011
March 2011
{placekitten}
by clochix & 1 other
A quick and simple service for getting pictures of kittens for use as placeholders in your designs or code. Just put your image size (width & height) after our URL and you'll get a placeholder.
February 2011
The Rising Importance of Flexible Web Layouts | Onextrapixel - Showcasing Web Treats Without A Hitch
by Monique
In this article, we'll discuss the basic pros and cons of each type of layout, and why flexible layouts, despite past drawbacks, will be gaining a competitive edge in the next several years over the once popular fixed-width choice.
December 2010
elRTE - open source WYSIWYG editor for Web
by oseres & 2 others
elRTE is an open-source WYSIWYG HTML-editor written in JavaScript using jQuery UI. It features rich text editing, options for changing its appearance, style and many more. You can use it in any commercial or non-commercial projects.
Main goal of the editor - simplify work with text and formating (HTML) on sites, blogs, forums and other online services. elRTE is developed by Studio 42 team for ELDORADO.CMS.
Usage
Rich text editing, change its appearance and style
Insert and manage various HTML elements with formatting (images, tables, lists and etc.)
View and edit HTML-code
Features
Advanced work with CSS
Setting indentation (margins, paddings) for images and table cells (seperate for each direction)
Controlling border properties (width, style, color) with convenient dialogs
Writing element properties as CSS-style always when possible
Lightweight, fast and easy to integrate
Interface appearance is configured from one CSS file
No templates used
i18n. The editor can be easily localized into any language
Designed to work with elFinder file manager, but can also be used with any other
Flexible for extensions
November 2010
The 1140px CSS Grid System/Framework · Fluid down to mobile
by Pictode & 5 others
The 1140 grid fits perfectly into a 1280 monitor. On smaller monitors it becomes fluid and adapts to the width of the browser.
Beyond a certain point it uses media queries to serve up a mobile version, which essentially stacks all the columns on top of each other so the flow of information still makes sense.
Scrap 1024! Design once at 1140 for 1280, and with very little extra work, it will adapt itself to work on just about any monitor, even mobile.
The 1140px CSS Grid System/Framework · Fluid down to mobile
by gregg & 5 others
The 1140 grid fits perfectly into a 1280 monitor. On smaller monitors it becomes fluid and adapts to the width of the browser.
Beyond a certain point it uses media queries to serve up a mobile version, which essentially stacks all the columns on top of each other so the flow of information still makes sense.
Scrap 1024! Design once at 1140 for 1280, and with very little extra work, it will adapt itself to work on just about any monitor, even mobile.
September 2010
Use API or XML File to Control Width & Dash Style of Legend Marker
by aspose_seo
Aspose.Report is a .NET query building and charting control allowing developers to quickly add ad hoc capabilities to their .NET applications as well as creating 21 popular chart types having some stylish effects like 3D rendering, transparency, gradients and anti-aliasing. Simply drag and drop the Aspose.Report component on Web or Win form, assign a DataTable object as data source & abstract a variety of outputs including SQL, Select, Where and Order By statements and many more.
June 2010
Gangsta Ass CSS3 Wrapping Drop Shadows
by marco
Better & leaner than the previous example CSS Drop Shadow, although as with the previous example, it does break if the width is too great..
Gérer les débordements de contenu grâce à CSS - Alsacréations
by dzc & 2 others (via)
# overflow: hidden : circulez, y'a rien à voir !
# La césure avec word-wrap : chérie, ça va couper !
# Les points de suspension avec text-overflow
# Fixer des limites avec max-width
May 2010
Istanbul - GNOME Live!
by tadeufilippini
FAQ
'Why is it so sluggish when recording?'
The problem is that the theora encoder takes up a lot of CPU power. Things you can do to reduce that effect:
i) use libtheora 1.0alpha6 or greater. This will speed up on x86 and amd64 architectures. ii) record at a lower width and height iii) select a smaller part of the screen.
Development
Development is done in GNOME git. Clone the repository using:
git clone git://git.gnome.org/istanbul
Contact
Contact me at zaheerabbas at merali dot org Feel free to submit patches, especially UI patches to the Istanbul product in GNOME Bugzilla!
CategoryProject
Istanbul (last edited 2010-03-25 21:40:12 by ZeeshanAli)
April 2010
Mark Finkle’s Weblog » Perils of the viewport meta tag
The viewport tag allows web developers to set the width, height and scale of the browser area used to display web content. However, some websites are not doing a good job configuring the viewport tag and it affects the presentation in Firefox.
March 2010
Marco.org - Overdoing the interface metaphor
by sbrothier
DVD players don’t make fake whirring noises for five minutes before letting you eject a disc to simulate rewinding. Similarly, nobody should need to perform a full-width swipe gesture and wait two seconds for their fake page to turn in their fake book1, and nobody should need to click the fake Clear button and start their calculation over because their fake calculator only has a one-line, non-editable fake LCD.
