Tag / css
A key feature of Flexbox and Grid Layout is that they can deal with distributing available space between, around and inside grid and flex items. Quite often this just works, and we get the result we were hoping for without trying very hard. This is because the specifications attempt to default to the most likely use cases. Sometimes, however, you might wonder why something ends up the size that it is.
Websites are looking more and more like mobile apps. Users are also increasingly expecting a more app-like experience. From push notifications to offline mode, native web apps are getting there. Once web apps function like native apps, the design interactions would also change to address the use case — namely, the ubiquity of animations. Animations drive interactions in all of our favourite apps, from Uber to Lyft and Snapchat to Instagram.
There are a few concepts in CSS layout that can really enhance your CSS game once you understand them. This article is about the Block Formatting Context (BFC). You may never have heard of this term, but if you have ever made a layout with CSS, you probably know what it is. Understanding what a BFC is, why it works, and how to create one is useful and can help you to understand how layout works in CSS.
You may have heard quite a bit of talk about a CSS feature called “Grid” this year. If you are someone who cringes when you hear the words “CSS” and “grid” in the same sentence, then I highly suggest you check out this new CSS module called CSS Grid. Browsers render HTML elements as boxes according to the CSS box model, and CSS Grid is a new layout model that provides authors the ability to control the size and position of these boxes and their contents.
I have some things I need to get off my chest. This is a ramble, but I’m in too much pain to tidy it up. If it’s too rambly, go to the final section about naming names at least, please.
Not Here was written in 2014, the year of #YesAllWomen. I might call it the moment I “woke” up, but like nested nightmares in which you wake up just to find yourself in another nightmare, I keep waking up and it doesn’t look to be stopping soon.
Shortly after I wrote Not Here, I wrote “Tweaking the Moral UI” for A List Apart. I went through rounds and rounds with my editor. If we were going to write this for a very male developer-heavy audience, we were going to have an article that was airtight. The only time I’ve come even close to that degree of editing was when I wrote for a peer-reviewed journal and a panel tore apart every sentence. For the Moral UI, every sentence got torn apart twice.
Potentially angering men is a dangerous business if you are a woman.
A woman’s worst nightmare? That’s prett..
Editor’s Note: Welcome to this month’s web development update. Anselm has summarized the most important happenings in the web community that have taken place over the past few weeks in one handy list for you. Enjoy!
As web developers, we’re working in a very diverse environment: We have countless options to specialize in, but it’s impossible to keep up with everything. This week I read an article from a developer who realized that even though he has been building stuff for the web for over seven years, sometimes he just doesn’t understand what’s going on: “I’m slamming my keyboard in frustration as another mysterious error appears in my build script,” he writes.
The post Monthly Web Development Update 10/2017: CSS Grid, CAA Pitfalls, And Image Optimization appeared first on Smashing Magazine.
CSS Grid is becoming the new layout standard for the web, and we are all still experimenting with what we can achieve with it. Some folks assume that CSS Grid is just a replacement for table layouts or Flexbox — but that's simply not true. Some also think that they can use CSS Grid to replicate more advanced print layouts, which brings us all closer to what's possible. Obviously print isn't web, but we can experiment with some of the techniques from print on the web, too.
One of the main reasons behind the idea of the CSS Grid Challenge was to have some starting points for layouts, and show what can be achieved with CSS Grids today. Well, we received some many great submissions that it was really hard to choose the one winner — there are so many submissions who deserve to win first place.
The post CSS Grid Challenge: Winners and Templates appeared first on Smashing Magazine.
In March this year, CSS Grid shipped into production versions of Chrome, Firefox and Safari within weeks of each other. It has been great to see how excited people are about finally being able to use it to solve real problems.
CSS Grid is such a different way of approaching layout that there are a number of common questions I am asked as people start to use the specification. This article aims to answer some of those, and will be one in a series of articles on Smashing Magazine about layouts.
The post CSS Grid Gotchas And Stumbling Blocks appeared first on Smashing Magazine.
Editor’s Note: Welcome to this month’s web development update. It’s actually the first one that we publish, and from now on, Anselm will summarize the most important things that happened over the past month in one handy list for you. So that you’re always up-to-date of what’s going on in the web community. Enjoy!
Today, I’d like to begin this update with a question I’m asking myself quite often, and that was fueled by the things I read lately: Where do we see our responsibility, where do we see other people’s responsibilities? And how do companies fit in here?
The post Monthly Web Development Update 09/2017: Functional CSS, Android 8 And iOS 11 appeared first on Smashing Magazine.
- L’ In Car entertainment une future industrie évaluée à 20 milliards de dollars
- Une géoingénierie sans risque ?
- Le leader des drones est Chinois et 7 pépites digitales
- Artist Theo Simpson on the liberating potential of designing and building
- French fancy: the top shows of Paris Fashion Week A/W 2018 menswear