TailwindCSS is a popular CSS framework, sometime you may want to use an arbitrary media query to make your website responsive, here are 2 options to do that.
Add a custom breakpoint to the config file
Add your breakpoints to the tailwind.config.js
:
Then, you can use this breakpoint in the html, like this:
Use arbitrary breakpoints directly
Sometime you may don’t want to add an official
breakpoint to the tailwind.config.js
, just using an arbitrary breakpoint for a specific case is more convenient. You can use an arbitrary breakpoint with []
syntax, like this:
Checkout the live demo.
Actually, you can use more arbitrary controls, like CSS values, CSS properties, and TailwindCSS variants, checkout the official doc for more details.
engineering
Create your blogs directly from Apple Notes.
Say goodbye to complex CMS updates and management issues!
You focus on creating quality content while Quotion takes care of the rest.
Latest
More from the blog
Qing
Introducing Realtime Preview
Today, we're excited to announce, Quotion supports Realtime Preview now. You can preview your latest changes on your Quotion sites in realtime, no more refresh your page manually. Demo :::note Click any pen links will load your site in realtime preview mode. You don't need to click every post via the pen. ::: Checkout our
Read post
Qing
Introducing KaTeX
Many students are using Quotion. One of the most wanted features is KaTeX for math. Today, we're excited to share that Quotion now supports KaTeX out of the box. 🔥 Preview The note: The post: Tech details We need KaTeX css to render expressions correctly, but it is a pretty big chunk, to reduce the
Read post
Qing
Introducing comment widgets
Today, we are excited to announce a new feature on Quotion - comment widgets! This feature allows our valued customers to engage with their readers easily and create a sense of community around their content. The best part? You don't need to use any 3rd-party solutions to enable it! How to enable it Go to
Read post