Lightboxes and keyboard accessibility | 456 Berea Street
The Lightbox effect is showing up pretty much everywhere on the web these days. There are approximately one million different implementations that basically do the same thing: when the user clicks on an image, the screen is dimmed and a larger version of the image is displayed until the user closes it by clicking a ”Close” link or icon. Many people love this effect, and it definitely can be very u
HTML5 sectioning elements, headings, and document outlines | 456 Berea Street
HTML5 sectioning elements, headings, and document outlines A subject I have returned to a couple of times is how to use headings to make good document outlines in HTML documents. See Headings and document structure conclusions for a summary of my reasoning. Recently I’ve been taking a closer look at how HTML5 changes the way document outlines are created. I’m not entirely sure that I have understo
HTML5 document outline revisited | 456 Berea Street
Since posting HTML5 sectioning elements, headings, and document outlines I’ve received a fair amount of feedback about my reasoning. None of the feedback I got has made me change my mind about how to use the sectioning elements in HTML5. So going forward, these are my conclusions. Untitled sections in the document outline Most responses about untitled sections have been along the lines of “So? The
CSS generated content and screen readers | 456 Berea Street
As all widely used web browsers (unless you still consider IE7 as being widely used) now support the :before and :after pseudo-elements along with the content property, using those pseduo-elements has become more and more common. There are many clever CSS tricks they can be used for, like implementing a particular design without having to insert extra markup into your HTML. There is one catch thou
Styling form controls | 456 Berea Street
A question that is frequently asked in forums like the css-discuss mailing list is how to style form controls in a consistent way across platforms. Most of the time, the question is asked by someone who has just tried to do that, and noticed the difference in rendering across browsers and operating systems. The short answer is probably disappointing to many: you can’t. Some also argue that you sho
Media queries, viewport width, scrollbars, and WebKit browsers | 456 Berea Street
Media queries, viewport width, scrollbars, and WebKit browsers When fine-tuning some media queries I noticed that layout changes seemed to happen at different window widths in Safari than in Firefox or Opera. When making the browser window narrower, media queries that specify a max-width kicked in a bit earlier in Safari. The difference seemed to be around 15 pixels, so I thought it might be relat
Beware of -webkit-text-size-adjust:none | 456 Berea Street
The other day I came a cross a website with text too small for me to read it comfortably. I hit Command-Plus a couple of times to make Safari bump up the text size a bit… and nothing happened. What? After some investigation of the CSS used on the site the culprit turned out to be the following CSS (don’t use): body { -webkit-text-size-adjust:none; } What that does is prevent WebKit-based browsers
Controlling text size in Safari for iOS without disabling user zoom | 456 Berea Street
Controlling text size in Safari for iOS without disabling user zoom The default viewport settings—the size and scale of the viewport—in Mobile Safari/Safari for iOS are optimised for websites with a width of 980 pixels. This means that if you use a fluid/elastic layout or media queries to make your layout adaptable, Safari on iOS doesn’t take advantage of the flexibility that offers but shows the
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Whenever you use :hover, also use :focus | 456 Berea Street