Tailwind CSS: How to Create a Vertical Divider Line
The example below shows you how to create a vertical line that splits a web page into two equal parts.
Screenshot:
The code:
<body class="bg-amber-200 relative">
<div class="absolute left-1/2 -ml-0.5 w-0.5 h-screen bg-gray-600"></div>
</body>Further reading:
- Using Tailwind CSS with Font Awesome Icons: A Deep Dive
- Tailwind CSS: Create a Responsive Top Navigation Menu
- How to Create Pill Buttons with Tailwind CSS
- Tailwind CSS: How to Create a Sticky Social Sharing Bar
- Tailwind CSS: Create an Animated & Closable Side Menu
- Tailwind CSS: How to Create a Hoverable Dropdown Menu
You can also check out our CSS category page for the latest tutorials and examples.
Subscribe
0 Comments
You May Also Like
