Skip to main content

css position: sticky

This links highlights what's new in Chrome 56:

https://developers.google.com/web/updates/2017/01/nic56?utm_source=frontendfocus&utm_medium=email

One cool thing amongst others (bluetooth access is also cool but this one css feature is something I wish we had a while back) is position:sticky.

It's available in Chrome 56 (stable as of Jan 2017) and to summarize, it allows to fix an element into the viewport when it's within a threshold.

.header {
 // Element will be "fixed" when it is 10px from the top of the viewport
 position:sticky;
 top: 10px
}

You could set top : 0; to make it stick directly to the top of the viewport.

Have to be conscious that this positioning might not be available in other browsers as of yet.

There's this site I use to check what's available: http://caniuse.com/#search=sticky

As of now, it's not available in IE (not very surprising...)


Comments

Popular posts from this blog

HTML5 Dev Conf and IOTAConf

Next week is going to be really fun. I have the opportunity to attend the HTML5DevConf and IOTAConf again and also go to a new conference hosted by Twitter: Twitter Flight Here's the schedule of the talks I intend to go for the HTML5DevConf: http://www.iotaconf.com/schedule.html http://html5devconf.com/schedule.html Monday: 7:30-9:00 Registration 9:00-9:50 1. The Web of things - Leveraging the web for the internet of things, E-135 2. Design patterns for an internet of things, N-123 3. Dump SASS and Less CSS for JS powered CSS, Michael Mikowski, Qualaroo, E-131 10-10:40 Break 10-40-11:30 1. How to create native-like experience in the mobile web, E-131 2. Bringing Web content to the big screen with google cast, E-130 11:40-12:30 1. Virtual Reality & the future of the web, E-135 2. The new meteor platform, web and native mobile from a single reactive javascript codebase, E-133 1:30-2:20 1. Engaging Apps: Service Workers, Push an

Run python inside python and capture output

This is taken from http://techkr.blogspot.com/2007/02/python-how-to-get-output-from-ossystem.html: How to execute python inside python and capture output: A quick solution using popen : import os result=os.popen('command').read() print result where command is your command (expl. on windows: dir,ipconfig,...) If you expect more than a line and want each word in a list: import os,string result=string.split(os.popen('dir/w').read())