cssgrid   1369

« earlier    

CSS Layout
a collection of popular layouts and patterns made with CSS
I collect most popular layouts and patterns that can be built with pure CSS.
They are powered by modern CSS features such as flexbox and CSS grid.
cssgrid  css  layout 
12 hours ago by aram
Web Design Experiments by Jen Simmons
Experiments demonstrating CSS Grid, and what's now possible in graphic design on the web.
css  design  flexbox  grid  inspiration  layout  webdesign  cssgrid  CSS_Grid  inspiring 
2 days ago by llimllib
Print To CSS | Website and blog of Front-end developer and web designer, Dan Davies
My name is Dan Davies, an experienced and highly skilled web designer and front-end developer from Flintshire, North Wales and currently working in Cheshire. Specialising in Web Design, WordPress, HTML, CSS3 and Sass, I build responsive websites that incorporate modern, clean code and am a big advocate of the content first approach. I have worked for some large digital agencies and with some very well known brands.
css  grid  grids  layout  cssgrid 
2 days ago by bruno
How to Overlap Images in CSS
Something very popular in web design currently is overlapping images. When the design is handed to you, as the developer to implement it, there are a few ways to go about it like most things with CSS.
fridayfrontend  css  cssbasics  images  overlapping  grids  cssgrid  layout 
6 days ago by spaceninja
Does JavaScript keep you too busy to care about CSS? Here are recent features you want to know about!
For the last few years, I have been busy exploring the world of JavaScript to the point that I neglected my passion for CSS. I am sure there are more people like me out there. I owe CSS a debt so I curated a list of recent features that you may want to know about if you didn't follow this space for a little while.
fridayfrontend  css  javascript  cssbasics  customproperties  variables  grids  cssgrid  variablefonts  typography  scroll-snap  logical-properties  sticky  houdini  featurequeries  supports  preprocessors  css-in-js 
6 days ago by spaceninja
CSS: An Art, a Science, a Nightmare (Everything You Should Know)
Some people think CSS is really hard and it's too much of a hassle to learn. Some people think that since it's not a programming language (or is it?), it's so easy that you don't even have to bother learning it. Ultimately, there's a lot to CSS, but it doesn't have to be overwhelming. If you learn a few key concepts, you should feel confident looking at or thinking of any design and turning it into reality.
fridayfrontend  css  cssbasics  layout  flexbox  cssgrid  grids  boxmodel  mediaqueries 
6 days ago by spaceninja
Web layouts like it’s 2020
The newer specs allow us to build layouts that we would have discarded for being unusable or for lack of responsiveness just a couple of years ago. So I believe it’s time to start revisiting those concepts. Maybe we can bring back some of those print-like layouts in a way that adapts to the unknown canvas of the web.
fridayfrontend  css  layout  cssbasics  cssgrid  grids  flexbox  multicol  exclusions 
6 days ago by spaceninja
Use CSS Subgrid to layout full-width content stripes in an article template
CSS Grid was missing one important piece when it's Level 1 specification was released into the world: Subgrid. The Level 2 specification is still in "Working Draft" status, but we have our first browser implementation. Mozilla has the Subgrid syntax in Firefox Nightly. Now that we have a live implementation, I've begun playing with the subgrid. Subgrid allows for elements that are grandchildren of the Grid container to take part in the initial grid definition. In this article, we'll be exploring one specific use case: augmenting a Grid-infused article layout. This article layout will allow for certain sections of content to break out into full-width areas.
fridayfrontend  css  cssgrid  grids  layout  subgrid 
6 days ago by spaceninja
Highlights From Building a Magazine Layout
Image taken from the book: Grids and Page Layouts by Amy Draver and Ben Jura.
cssbasics  css  cssgrid  fridayfrontend  tutorial  layout 
11 days ago by dholland
Creating complex layouts using CSS Grid
This tutorial is for people who have heard of css-grid and are interested to see what it can do or perhaps are not sure how to fit it into their workflow.
fridayfrontend  css  cssgrid  layout  grids 
12 days ago by spaceninja
Highlights From Building a Magazine Layout
The web technologies we have at our hands today are marvelous. Every day there is something new knocking on our doors. The decision is upon us; we either accept the challenge to learn new things or not. I wanted to pick a design that I can use new CSS techniques and try to grasp them more. For today, I chose a magazine layout with some pretty interesting, challenging design details.
fridayfrontend  css  cssbasics  layout  cssgrid  grids  print 
12 days ago by spaceninja
Print To CSS
Examples of creating print-based layouts to the web.
layouts  webdesign  webdev  cssgrid  grids  css  examples 
15 days ago by angusm

« earlier    

related tags

accessibility  aria  article  articles  aspectratio  autoprefixer  avengers  bash  block  boxmodel  calendar  calendars  cards  carousels  cheatsheet  codepen  codepens  columns  comments  components  conference  cool  css-grid  css-in-js  css-tricks  css  css3  css_grid  cssbasics  customproperties  dashboard  demo  design  development  django  documentation  examples  exclusions  fallback  fallbacks  featurequeries  flexbox  fridayfrontend  git  grid  grids  houdini  howtos  html  icons  ie  ie10  ie11  images  inline  inspiration  inspiring  intros  javascript  latex  layout  layouts  logical-properties  magazine  markdown  mediaqueries  menu  min  minmax  modular  movies  multicol  music  newspaper  newspapers  overlapping  pandoc  plugins  preprocessors  print  programming  prototyping  python  react  reactrouter  redux  reference  responsive  rwd  sass  scale  scrapbooks  scroll-snap  snippets  sticky  subgrid  supports  svg  talk  time  tips  tutorial  tutorials  typography  useful  variablefonts  variables  video  webdesign  webdev  webdevelopment  wordpress  writing-mode 

Copy this bookmark: