“Mobile first” CSS and getting Sass to help with legacy IE – Nicolas Gallagher
Taking a “mobile first” approach to web development poses some challenges if you need to provide a “desktop” experience for legacy versions of IE. Using a CSS pre-processor like Sass can help. As of Sass 3.2, there is another way of catering for IE, described by Jake Archibald. One aspect of a “mobile first” approach to development is that your styles are usually gradually built up from a simple b
Pure CSS GUI icons – Nicolas Gallagher
An experiment that uses pseudo-elements to create 84 simple GUI icons using CSS and semantic HTML. Shared as an exercise in creative problem solving and working within constraints. This is not a “production ready” CSS icon set. Demo: Pure CSS GUI icons Known support: Firefox 3.5+, Safari 5+, Chrome 5+, Opera 10.6+. An exercise in constraintSeveral months ago I was experimenting with the creation o
CSS drop-shadows without images – Nicolas Gallagher
Drop-shadows are easy enough to create using pseudo-elements. It’s a nice and robust way to progressively enhance a design. This post is a summary of the technique and some of the possible appearances. Demo: CSS drop-shadows without images Known support: Firefox 3.5+, Chrome 5+, Safari 5+, Opera 10.6+, IE 9+ I’ll be looking mainly at a few details involved in making this effect more robust. Divya
Pure CSS speech bubbles – Nicolas Gallagher
Speech bubbles are a popular effect but many tutorials rely on presentational HTML or JavaScript. This tutorial contains various forms of speech bubble effect created with CSS 2.1 and enhanced with CSS3. No images, no JavaScript and it can be applied to your existing semantic HTML. The CSS file used in the demo page is heavily commented so that you can see which lines of code are responsible for e
CSS image replacement. One more time. – Nicolas Gallagher
An accessible image replacement method using pseudo-elements and generated-content. This method works with images and/or CSS off, with semi-transparent images, doesn’t hide text from screen-readers or search engines, and provides fallback for IE 6 and IE 7. Known support: Firefox 1.5+, Safari 3+, Chrome 3+, Opera 9+, IE 8+ What’s wrong with current methods?The two most widely used image replacemen
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Jump links and viewport positioning – Nicolas Gallagher
