Cascading Style Sheets are used to define the presentation layer of websites. How CSS works is not always self-evident, so many of these articles explain various aspects of using CSS.
CSS generated content is announced in some - but not all - screen readers, so use with care.
There is a clever script that fixes the iOS orientation change zoom bug. Here is a reminder about a couple of issues you may run into when using it.
As text columns become narrower, the risk of long words overflowing increases. Luckily you can use the hyphens and word-wrap CSS properties to prevent it.
Don’t add boilerplate code, polyfills, shivs, frameworks and other things that increase the weight of your site unless you actually need it.
Images that have a CSS max-width, a width attribute in the HTML, and are children of a floated element that has no explicit width set may be invisible in IE8.
It used to be possible to apply any CSS to visited links. This has privacy issues, so most browsers have implemented styling restrictions and only allow colours to be changed.
If you’re using width:100% to undo a previously set width on a block level element, you should probably be using width:auto instead. Here’s why.
When applying CSS to buttons there are some odd behaviours in WebKit browsers for iOS. Luckily there are at least two ways of working around them.
Some CSS intended for visual media types only has unexpected and semantic effects on screen readers.
A way of styling the closed state of select elements without sacrificing accessibility.
When you use the table-related display properties of CSS to get the display properties of a table, some screen readers will treat the non-table markup as a real table.
In many situations when we tend to use links to trigger actions we should really be using buttons. Here’s how to use real button elements and make them look like links.
Many developers expect screen readers to ignore visual styling of semantic HTML elements. They mostly do, but with list items their behaviour is hit-or-miss.
The Firefox default stylesheet uses the !important keyword when declaring line-height for text inputs. You can’t override this from an author stylesheet, so a workaround is necessary.
Hiding content with display:none hides it from all users, including those who use screen readers. Be aware of this when deciding how to hide content visually.
The Book of CSS3 is a great developer companion - a no-nonsense, well-written guide to the various specifications that make up CSS3.
In this brief and easy-to-read book, Aaron Gustafson does an excellent job of explaining what progressive enhancement is and how to apply it in your daily work.
Ethan Marcotte’s book on designing for an ever-increasing variety of browsers, resolutions and screen sizes is a must-read for all web professionals.
Some browsers don’t let you center button elements horizontally by assigning auto margins. Bug or not?
How to use generated content to style the numbers of an ordered list separately from the rest of the list item.
Page navigationPage 1 | Page 2 | Page 3 | Page 4 | Page 5 | Page 6 | Page 7 | Page 8 | Page 9 | Page 10 | Page 11 | Page 12 | Page 13 | Page 14 | Page 15 | Page 16 | Page 17 | Page 18 | Page 19 | Page 20 | Page 21
Subscribe / follow
DreamHost web hosting
Use the promo code 456BEREASTREET3 to save USD 20 when you sign up for DreamHost