barryf + css   184

Buefy
> Lightweight UI components for Vue.js based on Bulma.
vuejs  ui  css 
september 2017 by barryf
Shoelace
Another CSS framework but quite easy to grasp and lightweight.
css  framework 
september 2017 by barryf
Flexbox Froggy
A [fun] game for learning CSS flexbox
flexbox  css 
june 2017 by barryf
How Flexbox works
(explained with big, colorful, animated gifs)
flexbox  css  alignment 
june 2017 by barryf
Griddy
Creates CSS to implement CSS Grids.
css  layout  grid 
may 2017 by barryf
HTML & CSS Is Hard
Great beginners (and beyond) tutorial for web development
html  css  tutorial  beginner 
february 2017 by barryf
Pure
Small CSS framework with forms and grids
css  framework 
november 2016 by barryf
TACHYONS
> Create fast loading, highly readable, and 100% responsive interfaces with as little css as possible.
css  framework  responsive 
october 2016 by barryf
Basscss
> Low-Level CSS Toolkit
css  framework 
october 2016 by barryf
Medium’s CSS
The evolution of Medium's CSS strategy
css  less  medium 
january 2016 by barryf
Fitter Happier Text
Fully justified text (via SVG)
text  effect  css  design  justified 
may 2015 by barryf
Can I use...
> Support tables for HTML5, CSS3, etc
html  css  browser  standards 
may 2015 by barryf
Frontend Guidelines
Some HTML, CSS and JS best practices.
html  css  js  tips  guide 
march 2015 by barryf
Skeleton
Responsive CSS boilerplate
responsive  css  boilerplate  template 
february 2015 by barryf
Cursors
List of cursors available through CSS
css  cursor  pointer  mouse 
october 2014 by barryf
CodeKit
Asset compilation and image optimisation in a Mac app
mac  css  asset  compilation  checklist 
july 2013 by barryf
DevDocs
Quick access to HTML, CSS and jQuery documentation
html  css  jquery  documentation 
june 2013 by barryf
A Collection of Page Transitions
CSS and JavaScript animations in the browser
animation  css  javascript  browser  presentation 
june 2013 by barryf
Hammer for Mac
Static site generator app that compiles SASS, HAML, CoffeeScript, Markdown, etc.
html  css  haml  sass  coffeescript  markdown  mac  generator 
may 2013 by barryf
Responsive Web Design Patterns
A collection of patterns and modules for responsive designs.
responsive  design  css  layout 
october 2012 by barryf
reveal.js
Presentations using CSS 3D transitions
presentation  javascript  slideshow  3d  css 
july 2012 by barryf
The Toolbox
Directory of useful single-page sites, tools, widgets and apps for web site developers.
toolbox  css  useful  design  web 
may 2012 by barryf
Responsive Navigation Patterns
Pros and cons of the different approaches for presenting navigation in responsive designs
design  css  mobile  navigation  responsive 
march 2012 by barryf
Live.js
Continually reloads HTML/CSS/JS - handy for realtime designing without needing a cmd-tab-cmd-r cycle
css  refresh  dev  live  realtime 
december 2011 by barryf
Bootstrap, from Twitter
Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. It includes base CSS and HTML for typography, forms, buttons, tables, grids, navigation, and more.
bootstrap  css  twitter  framework  design  javascript  less 
december 2011 by barryf
Normalize.css
Normalises styles across browsers but preserves defaults where they're useful
normalise  css  design  reset  browser 
september 2011 by barryf
Make Your HTML Email 5.5 Times More Mobile Friendly
(tips are also applicable for websites in general)
mobile  html  email  design  css 
august 2011 by barryf
Adactio: Journal—Re-tabulate
Switch the display of content and navigation depending on browser size using media query CSS.
navigation  content  design  layout  css  mobile 
august 2011 by barryf
Sprite Cow - Generate CSS for sprite sheets
Gives you background-position, width and height for sprites within an image
sprite  image  css  background  design  layout 
june 2011 by barryf
A Whole Bunch of Amazing Stuff Pseudo Elements Can Do
Clever uses for :before and :after. The multiple backgrounds on an element is especially useful.
css  before  after  pseudo  design 
june 2011 by barryf
CSS drop shadows
Lifted corners, curled corners, perspective, raised, curved edges and more. All without images.
design  box  css  corner  perspective  button  effect  shadow 
april 2011 by barryf
Media Queries
Gallery of responsive web designs that adapt to the viewport
mediaquery  css  gallery  design  layout 
march 2011 by barryf
Designing for iOS: Life Beyond Media Queries
Tips for targeting iPhones/iPods including orientation, zooming, special icons and hiding toolbars
iphone  ipod  ios  css  design 
december 2010 by barryf
Ultimate CSS Gradient Generator
CSS gradients for Firefox, Webkit and IE with fallback background colour for older browsers
css  gradient  design  browser 
october 2010 by barryf
Hardboiled CSS3 Media Queries
Min/max device widths for smartphones, iPads, etc.
smartphone  ipad  mediaquery  css  css3  design  layout 
october 2010 by barryf
Less Framework 2
CSS framework with baseline grids, media-queries and boilerplate code
css  framework  grid  mediaquery  mobile  design 
september 2010 by barryf
Cross-browser kerning-pairs & ligatures
text-rendering: optimizeLegibility; -- on by default for Firefox above 20px; required for Webkit
font  typography  ligature  kerning  text  webkit  css 
august 2010 by barryf
What you can learn from Panic's approach to email marketing
I love the attention-grabbing glowing "click here to x" button that uses webkit glow animation. Useful in normal web pages too.
css  css3  email  marketing  design 
july 2010 by barryf
Sticky Sidebar with Scrolling
A more advanced form of "position: fixed" that initially scrolls until it hits a mark
scrolling  design  css  sidebar  fixed 
july 2010 by barryf
CSS3 PIE
PIE makes Internet Explorer 6-8 capable of rendering several of the most useful CSS3 decoration features, including border-radius, box-shadow and linear-gradient
css3  ie  gradient  css  design  javascript 
july 2010 by barryf
CSS for iPhone 4
Targeting iPhone 4 with HTML link tag
html  iphone  iphone4  css 
june 2010 by barryf
iPad Orientation CSS
Selectively use distinct stylesheets depending on your iPad's orientation
css  orientation  ipad  browser 
april 2010 by barryf
@font-face
Comprehensive guide to using @font-face, including links to suitable fonts
fontface  font  design  css  typography 
march 2010 by barryf
Premailer: pre-flight for HTML email
Takes HTML and reformats for sending as email. Rewrites links to make them absolute and adds any tracking necessary. External CSS put inline.
css  html  email  inline  layout  web  campaign  work 
march 2010 by barryf
Revised Font Stack | A Way Back
Up-to-date detailed list of safe alternative lists when specifying fonts in CSS
css  font  design  typography  type  web 
march 2010 by barryf
Bulletproof @font-face syntax « Paul Irish
Best practice for using external fonts across browsers
font  css  fontface  design  bestpractice  web 
september 2009 by barryf
Thin Text in Safari with Snow Leopard
Neat hack to make anti-aliased text look nice in Safari
safari  font  shadow  css  hack  browser  thin 
september 2009 by barryf
Text Rotation with CSS
-webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
rotate  rotation  css  design  typography 
august 2009 by barryf
Fluid 960 Grid System
Fluid/fixed 12 and 16 column layouts with example elements that scale magically
web  design  layout  css  grid  framework  fluid 
january 2009 by barryf
Different approaches to positioning a comment icon in Basecamp and Backpack
Absolutely position the disappearing comment bubble with a relatively positioned div to stop the page jumping
web  design  layout  relative  absolute  comment  css 
january 2009 by barryf
flipping typical
Intelligent and useful web page that guesses the fonts installed locally and allows you to try out sample text in each
visualisation  font  typography  useful  design  css 
january 2009 by barryf
Grid Designer 2
Enter widths, gutters and/or number of columns and this tool will work out the dimensions you need to use. It can also export CSS for the layout and also typography, aligned to a baseline grid
web  design  calculator  grid  layour  css  template  useful  typography  baseline  framework  generator 
january 2009 by barryf
RGBA colors - CSS3
How to use RGBA - Safari 3/Webkit only for now
rgba  colour  alpha  web  css  css3  safari  webkit 
october 2008 by barryf
Firefox 3 anti-aliasing glitch
If you use the opacity CSS property you get ugly text in Firefox 3 Mac
firefox  css  opacity  bug  text  font  typography  mac 
october 2008 by barryf
mezzoblue § Zoom
It's now cool to use pixel font sizing
font  design  layout  css  typography  standards  web  zoom  browser  accessibility 
october 2008 by barryf
Feed IE 6 with a basic stylesheet
Reminder of how to serve special stylesheets to IE
ie  internetexplorer  browser  web  standards  css 
october 2008 by barryf
Chrome vs. Safari
Google Chrome doesn't render text-shadow or drop shadows correctly. Yet.
google  chrome  image  shadow  design  browser  standards  css 
september 2008 by barryf
Web Development for the iPhone
Building an iPhone Safari app - viewports, CSS and JavaScript
web  dev  safari  iphone  ipodtouch  mobile  css 
august 2008 by barryf
960 Grid System
12 or 16 column grids with templates for Fireworks, OmniGraffle, etc.
web  design  css  grid  framework  layout  template  omnigraffle  fireworks  column 
august 2008 by barryf
Fonts available for @font-face embedding
(whereby the author has licensed their use)
font  embed  css  design  typography  free  licence  web  fontface 
july 2008 by barryf
ie7-js
Make IE behave correctly, including CSS selectors
css  javascript  ie7  hack  browser  library  standards  ie 
july 2008 by barryf
Preload images referenced in a stylesheet
Uses Prototype to pull out all CSS images and preload them
css  image  prototype  javascript  preload  optimisation  performance  web  design 
june 2008 by barryf
The Perfect 3 Column Liquid Layout
No CSS hacks. SEO friendly. iPhone compatible.
css  layout  design  column  liquid  iphone  seo  web 
june 2008 by barryf
Web designers should do their own HTML/CSS
I totally agree. Now, where are these mythical creatures hiding?
web  design  css  html  layout  advocacy  opinion  trends  work 
june 2008 by barryf
GridFox
Overlay grid guides in Firefox
firefox  grid  web  design  layout  css  extension  plugin 
may 2008 by barryf
Grid Calculator
Use sliders for base font size, number of columns, column width and gutter width and it'll calculate everything for you
grid  css  layout  design  calculator  web 
april 2008 by barryf
« earlier      
per page:    204080120160

related tags

3d  absolute  accessibility  adobe  advocacy  after  ajax  alignment  alpha  animation  api  architecture  arrows  asset  async  background  baseline  before  beginner  behaviour  benchmark  bestpractice  blockquote  blog  boilerplate  bootstrap  box  branding  browser  bubble  bug  business  button  cache  calculator  callout  campaign  canvas  career  checklist  chrome  cloaking  cms  code  codegent  coffeescript  coldfusion  colour  column  comment  community  compilation  compression  content  corner  css  css3  cssquery  cursor  design  dev  dialog  documentation  dojo  dom  dropdown  eclipse  effect  effects  email  embed  ems  event  example  ext  extension  fade  file  firefox  fireworks  fixed  flash  flexbox  fluid  font  fontface  footer  form  framework  free  freelance  gallery  generator  gmail  google  gradient  graphic  grid  guide  hack  haml  header  html  ide  ie  ie6  ie7  image  inline  input  inspiration  interaction  interface  internetexplorer  ios  ipad  iphone  iphone4  ipod  ipodtouch  javascript  jobs  jquery  js  justified  kerning  layour  layout  less  library  licence  ligature  lightbox  liquid  live  mac  markdown  marketing  markup  mediaquery  medium  menu  microsoft  minification  mobile  modal  mootools  mouse  mozilla  myspace  nav  navigation  newsletter  normalise  omnigraffle  opacity  opensource  opinion  optimisation  orientation  outlook  panic  patterns  pdf  performance  perspective  photo  plugin  png  pngfix  pointer  predictions  preload  presentation  prettify  printing  progressive  prototype  pseudo  quotation  quote  rails  rating  realtime  redundancy  reference  refresh  relative  reset  responsive  rgba  rotate  rotation  rss  ruby  safari  sass  screenshot  scriptaculous  scrolling  security  selector  seo  shadow  sidebar  sifr  slideshow  smartphone  speech  sprite  standards  star  startup  stock  syntax  tab  table  tabs  tags  template  test  text  thin  thumbnail  tips  toolbox  tooltip  transparency  trends  tutorial  tv  twitter  type  typography  ui  usability  useful  ux  validation  visualisation  vml  vuejs  web  web2.0  webfont  webkit  widget  wii  window  work  wufoo  xbl  xhtml  xml  xss  yahoo  zoom 

Copy this bookmark:



description:


tags: