question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Feature request: Variable sizing utilities based on user's viewport

See original GitHub issue

I didn’t find a way to set different sizes on one element with sizing utilities classes. It would be nice to be able to use classes like

<div class="w-25 w-md-50 w-lg-100"></div>

And resize the element according to the breakpoint.

I would be happy to work on it if it gets approved.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:10
  • Comments:11 (2 by maintainers)

github_iconTop GitHub Comments

17reactions
mdocommented, May 20, 2018

No plans to add this at this time.

3reactions
ffooddcommented, Jan 19, 2022

In v5, the recommended way is to override utilities to make them responsive.

Read more comments on GitHub >

github_iconTop Results From Across the Web

[Feature-12920]Determining size of View - Ignition Early Access
Is there a way to get the current size (width and height) of a View? Or the size of the web browser window...
Read more >
Developing responsive layouts with React Hooks
Now whenever the window is resized the width state variable is updated to equal the new viewport width, and our component will re-render...
Read more >
Work with viewport components
Work with viewport components · Locate the viewport ID and route. · Select the viewport component in the Content tree, then click Edit...
Read more >
Determining the Size and Location of Viewports on a Sheet
Today, let's look at how to determine the size and location of a sheet and the views displayed by it. This is part...
Read more >
Can media queries resize based on a div element instead of ...
width , height , and other dimension-based media features all refer to the dimensions of either the viewport or the device's screen in...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found