-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
b2db8c0
commit ec2720f
Showing
1 changed file
with
74 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,74 @@ | ||
# CSS Top 10 Articles for the Past Month (v.Sep 2018) | ||
|
||
<img src="sep-CSS-top10.png" width="800" alt="Mybridge"></a> | ||
|
||
For the past month, we ranked nearly 1,000 CSS articles to pick the Top 10 stories that can help advance your career (1% chance). | ||
|
||
* Topics in this list: Animated, Responsive Images, Scroll Snapping, Exploring SMACSS, CSS Grid, Large scale CSS systems, Alignment In Flexbox, Shapes, Pie Chart, Relative units | ||
* Also published on [Medium](https://goo.gl/3r3cbd) | ||
|
||
<br> | ||
|
||
#### Course of the month: | ||
|
||
<br> | ||
|
||
## Rank 1 | ||
### [Flexbox — The Animated Tutorial](https://medium.com/@js_tut/flexbox-the-animated-tutorial-8075cbe4c1b2?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more) | ||
|
||
|
||
<br> | ||
|
||
## Rank 2 | ||
### [Time-saving CSS techniques to create responsive images](https://medium.freecodecamp.org/time-saving-css-techniques-to-create-responsive-images-ebb1e84f90d5?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more) | ||
|
||
|
||
<br> | ||
|
||
## Rank 3 | ||
### [Practical CSS Scroll Snapping](https://css-tricks.com/practical-css-scroll-snapping?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more) | ||
|
||
|
||
<br> | ||
|
||
## Rank 4 | ||
### [Exploring SMACSS: Scalable and Modular Architecture for CSS](https://www.toptal.com/css/smacss-scalable-modular-architecture-css?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more) | ||
|
||
|
||
<br> | ||
|
||
## Rank 5 | ||
### [CSS Grid in 45 Minutes!](https://www.youtube.com/watch?v=DCZdCKjnBCs?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more) | ||
|
||
|
||
<br> | ||
|
||
## Rank 6 | ||
### [Creating the “Perfect” CSS System: A high level guide for designers and developers who write CSS, but want to be more strategic about building moderate to large scale CSS systems](https://medium.com/gusto-design/creating-the-perfect-css-system-fa38f5bcdd9e?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more) | ||
|
||
|
||
<br> | ||
|
||
## Rank 7 | ||
### [Everything You Need To Know About Alignment In Flexbox](https://www.smashingmagazine.com/2018/08/flexbox-alignment?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more) | ||
|
||
|
||
<br> | ||
|
||
## Rank 8 | ||
### [Experimental layouts with CSS Shapes and clip-path](https://codepen.io/michellebarker/post/experimental-layouts-with-css-shapes-and-clip-path?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more) | ||
|
||
|
||
<br> | ||
|
||
## Rank 9 | ||
### [Simple Interactive Pie Chart with CSS Variables and Houdini Magic](https://css-tricks.com/simple-interactive-pie-chart-with-css-variables-and-houdini-magic?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more) | ||
|
||
|
||
<br> | ||
|
||
## Rank 10 | ||
### [15 CSS Relative units, how many do you know? em, rem, ex, cap, ch, ic...](https://dev.to/bytegasm/15-css-relative-units-how-many-do-you-know-em-rem-ex-cap-ch-ic-6m?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more) | ||
|
||
|
||