Lessons: 6Length: 35 minutes
- Overview
- Transcript
1.1 Welcome to the Course
Hey everyone, welcome back to Envato Tuts+. I’m Adi, and in this course, you’ll learn about CSS logical properties.
If you’ve never heard about them, don’t worry—they’re pretty new, but they’re also pretty awesome!
The basic idea behind CSS logical properties is that we can use them to create layouts that automatically adapt to the writing direction of the document.
For example, if we’re building a website that needs to be displayed in both English and Arabic, then using the traditional “physical” properties like “left” and “right” can be very complicated. While English is written in an LTR direction or “Left to Right”, Arabic is RTL or “Right to Left”. That’s why, for this kind of application, we need to use “logical” properties like “Start” and “End”.
In this course, we’ll take a look at how writing direction works and how logical properties follow this direction. Then we’ll cover the most important types of CSS properties that can benefit from them: text alignment, margin, padding, border, width and height, position, and float.
I’ll also be using some common components for the demos so you can see exactly how all of this can be applied to a real project.
So, if you’re ready, I think we should get started.
Related Links
1.1 Welcome to the Course
Hey everyone, welcome back to Tuts Plus. I'm Adi, and in this course you will learn everything you need to know about CSS logical properties. Now if you've never heard about these, don't worry, they're pretty new, but they're also pretty awesome. The basic idea behind them is that we can create layouts that automatically adapt to the writing direction of the documents. So for example, if you're building a website that needs to be displayed in English, but also in let's say Arabic, then using the traditional physical properties like right and left can get very complicated. Because while English is written in an LTR mode, or left to right, Arabic is the other way around. It's RTL or a right to left. That's why in these types of situations, it's best we use a logical properties like Start and End instead of left and right, but more about that later. For now, here's what you'll learn in this course. First we'll take a look at how writing direction works and how logical properties follow this direction. Then we'll cover the most important types of CSS properties that can benefit from them, text alignment, margin, padding, border, Width and height, position and float. I'll also be using some very common components for the demos in this course, and that way you'll be able to see exactly how all of this can be applied to a real project. With that said, I think we should just get started. But before we do that, let me quickly tell you about Envato elements. With one subscription you'll have unlimited access to assets like fonts, markups, and CMS templates, and more. There are millions of digital assets to choose from. They have simple commercial licensing, and you can cancel anytime. Subscribe now using the link in the video description. All right, let's get started by taking a closer look at content direction and logical properties. That's coming up in the next lesson. So, I'll see you there.
