public marks

PUBLIC MARKS from decembre with tags Responsive & tutorial

2017

CSS - RESPONSIVE - CALC - Imitating calc() Fallback or Fixed-Width Sidebar In Responsive Layout — Osvaldas Valutis (2013)

If you were attentive you should see that the line width: calc( 12.5em ) is the trick here. Why? Let’s see all these widths like in pairs – exactly what we need browsers to do. The first pair is width: 80% (content) and width: 16.666% (sidebar) that does the job in calc() incompatible browsers, which will just ignore calc(). It is the callback (backup). It means that the minority of website visitors will see narrower sidebar on narrower viewports. And that should be perfectly fine for people using older browser versions. The second: width: calc( 100% - 15em ) and width: calc( 12.5em ). This is for newer browser versions which will override the previous width definitions

2014

CSS - RESPONSIVE - Flexible Foundations | Trent Walton

Responsive or not, there’s no reason why we shouldn’t all be designing and building sites on flexible foundations.

decembre's TAGS related to tag Responsive

Adaptative +   analyse +   blog +   bookmarklet +   browser +   calc +   chrome +   cms +   css +   css3 +   CSSjavascript +   customiser +   demo +   design +   dev +   development +   device +   dom +   em +   firefox +   flexible +   fluid +   Google:Chrome +   guide +   html +   icon +   image +   implementation +   javascript +   layout +   lenght +   madia-query +   Media Queries +   media-screen +   media:queries +   mobile +   outil +   php +   picto +   picture +   polyfill +   px +   resize +   resource +   ressource +   s +   scale +   screen +   size +   solution +   srcset +   tool +   tuto +   tutorial +   tutoriel +   viewort +   viewport +   vw +   web +   webdesign +   width +