As you know with the new version of Bootstrap 3 each viewport is represented by a class name respectively are col-lg- , col-md- , col-sm- and col-xs-. I created this little extension to help me switch between different viewports while resizing the browser and decide which content should show in which device. I will add more options to it in the future till then I hope you will find it useful while working with Bootstrap.
You can Follow the below Step By Step procedure to install the Viewport Detector Chrome Extension to your Chrome Web browser.
It is the Viewport Detector Chrome extension download link you can download and install Chrome Browser.
This extension displays Chrome’s viewport dimensions when resizing the browser window.
Quickly toggle a Bootstrap Grid Overlay that automatically uses your application's styles to determine how it looks.
Resize browser window to Bootstrap sizes like col-lg col-md etc..
This extension displays Chrome’s viewport dimensions when resizing the browser window.
This extension displays Chrome’s viewport dimensions when resizing the browser. Simple, straight forward and with zero bloat.
Responsive design testing tool to test any website’s responsiveness – it only takes 2 seconds! Emulate various screen resolutions.
Generate media-queries, show screen sizes width and link to a list of media-queries snippets.
Determines browser window width and which bootstrap viewport is in use.