Tag Archives: CSS

Writing Less Damn Code

The better you understand the newest HTML and CSS, you’ll find that much of the code we write can be eliminated altogether

 

But it turns out the only surefire way to make performant Web Stuff is also to just write less. Minify? Okay. Compress? Well, yeah. Cache? Sounds technical. Flat out refuse to code something or include someone else’s code in the first place? Now you’re talking.

Read more from heydonworks.com

The Search For The Holy Grail: How I Ended Up With Element Queries, And How You Can Use Them Today – Smashing Magazine

EQCSS, an experiment in extending CSS with Element Queries, a way to apply styles based on element-specific conditions

 

For some time, we’ve run up against the limits of what CSS can do. Those who build responsive layouts will freely admit the frustrations and shortcomings of CSS that force us to reach for CSS preprocessors, plugins and other tools to help us write the styles that we’re unable to write with CSS alone. Even still, we run into limitations with what current tools help us accomplish. Think for a moment of a physical structure. If you’re building a large edifice with weak material, a lot of external support is required to hold it together, and things have to be overbuilt to stay sturdy. When you’re building a website out of HTML, CSS and JavaScript, this external support might look like frameworks, plugins, preprocessors, transpilers, editing tools, package managers and build processes.

Read more from the source: Smashing Magazine

WebKit stops prefixing

WebKit ends its use of prefixes following Microsoft’s decision to make Edge support WebKit prefixes

 

WebKit’s new feature policy is to implement experimental features unprefixed, behind a runtime flag.

We’ll be evaluating existing features on a case-by-case basis. We expect to significantly reduce the number of prefixed properties supported over time but Web compatibility will require us to keep around prefixed versions of some features.

Read the announcement at WebKit

CSS Scroll Snap Points Module Level 1

Get more control of the scroll bar with the proposed CSS scroll snap points feature

 

Popular UX paradigms for scrollable content frequently employ paging through content, or sectioning into logical divisions. This is especially true for touch interactions where it is quicker and easier for users to quickly pan through a flatly-arranged breadth of content rather than delving into a heirarchical structure through tap navigation. For example, it is easier for a user to view many photos in a photo album by panning through a photo slideshow view rather than tapping on individual photos in an album.

However, given the imprecise nature of scrolling inputs like touch panning and mousewheel scrolling, it is difficult for web developers to guarantee a well-controlled scrolling experience, in particular creating the effect of paging through content. For instance, it is easy for a user to land at an awkward scroll offset which leaves a page partially on-screen when panning.

Read the W3C proposal at: drafts.csswg.org

normalize.css hits 4.0

I ran into an IE 9 – 11 bug last night that would have been fixed with a css reset and now I have more respect for normalize.css

 

What does it do?

  • Preserves useful defaults, unlike many CSS resets.
  • Normalizes styles for a wide range of elements.
  • Corrects bugs and common browser inconsistencies.
  • Improves usability with subtle modifications.
  • Explains what code does using detailed comments.

Read more and download on GitHub