How do develop for multiple screens?

When working with react and TailwindCSS(or any kind of CSS), i usually build layouts for multiple screensizes either by using media querries or screen breakpoints. How can i do that here?

Hi, there is no direct way of doing that, you would have to use the width and Height of each component to define it


in advanced, you can use a formula, where you can have screen size as a variable. that way your content adapts accordingly

2 Likes

i dont understand? how do you set that?

You can make two components for example:

ContainerWeb: visible if screen.width >= 600px
ContainerMobile: visible if screen.width < 600px

This is how I handle it throughout my app

1 Like

Ah SO let me get this striaght cause im retarded- no really… see self portrait… Where it says basis I put less than 600px and the width and height of the component etc for the phone view and more than 600px for the tablet view then I use the view tool for tablets and design the tablet view and select a phone to do the phone view… what about font sizes? same thing? it will just auto adjust cause i build different fonts in the different views?

dang cant