CSS: inner elements breaking border-radius
Some browsers support border-radius for rounded corners. But inner elements may break those corners. Simply using overflow:hidden on the outer element can often help solve this problem Continue reading
Category Archives: CSS
Use CSS display:table for Layout
For a few years now, web developers doing CSS-based layouts have used floats or absolute positioning for layout web sites to avoid using non-semantic HTML <table>s.
While doable, extra hoops often have to be jumped through (mostly for IE) and some seemingly simple things can be harder than necessary (like equal height columns).
However, for a simpler solution, CSS-based display:table, display:table-row, display:table-cell etc are all usable today across Firefox 2+, Safari 3+, Opera 9+ and IE8. Continue reading
Hiding Content on Web Pages for Accessibility
Web pages often benefit from some text that may not be necessary from a visual design perspective, but offer additional context to say blind users using a screen reader. Some CSS techniques to achieve this include moving text off the screen in such a way that screen readers will still read them out. However, there is a concern that search engines may not like this technique as it could be abused for keyword stuffing and other such practices. What are the implications? Continue reading