The next one is the border (not the border between two countries) this is border in CSS. As I have explained earlier, the border is the area that surrounds or basically outlines the padding.
Let's clear the top-padding and bottom-padding and sets the overall padding to 15px
Like this 👇
Let me show you what border is, let's create one simple red border. We can't just go ahead and type border and type red, no, it doesn't work that. Border has 3 properties we need to set in other to make a border and we have the;
border-color: red;
border-width: 3px;
border-style: dashed;
You can use any other color, more than 3px and even different styles (solid, dotted, dashed etc)
Now we have a red 3pixel wide dashed border, pretty cool, right? And like we did we have top, bottom, left and right for padding, we can also set different values for our borders too.
Maybe you want the top to be different from the bottom border or maybe you want the border to appear only at the bottom like an underlined statement, you can specify that by using special properties. Let's say for instance, we wanna change only the top style. We can use;
border-top-color: green;
border-top-style: dotted;
border-top-width: 4px;
Before you add the above style, make sure you clear the former overall border style
Like this 👇
We should get a nice dotted and green 4pixel border just at the top only. It's looks ugly but that's just to show you how you can style a specific part of your border, you can change the top to bottom or left or right and see other effects.
