'Tailwind css border position

I'm trying to create a border position
nomal css :

border-top: 10px solid transparent;
border-bottom: 10px solid black;
border-left: 10px solid transparent;
border-right: 10px solid transparent;

how can i implement with tailwind css?

csstailwind-css


Solution 1:[1]

Implement with tailwind css like this class below:

<div class="border-[10px] border-solid border-transparent border-b-black"></div>

Solution 2:[2]

Use the class as follows

<div class="border-[10px] border-solid border-transparent border-b-black"></div>

Here,

  • border-[10px] means border: 10px;
  • border-solid means border: solid;
  • border-transparent means border: transparent ;
  • border-b-black means border-bottom: black ;

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 VMT
Solution 2 Mohit Maroliya B17CS036

Related Questions