CSS debug alignment

Add background-color on all elements to debug css alignment

CSS debug alignment is available for download. It had 760 active users before it was removed from Chrome Web Store on 2022-07-22, and it has been downloaded from Chrome-Stats 2 times. The latest version is 2.1, and it was published 3 years ago. Be careful when installing it.

View source code
Total download count: 2 (Only count downloads from Chrome-Stats)

All available versions

You can find the current and older versions of CSS debug alignment here. You can download the archived versions or inspect their source codes.

As a free user, you can only download the latest version.

Upgrade to download older versions
 1 version available for download.

Install CRX file

Option 1: The easy way (for Windows users only)

  1. Download and run chrome-stats.exe file on your PC. This method will allow you to install Chrome extensions directly from chrome-stats.com in one click. You only need to do this once!
  2. Type in chrome://restart in the URL bar to restart the browser for the changes to take effect.
  3. Download and install the CSS debug alignment CRX file

Option 2: Advanced method

  1. Download CSS debug alignment CRX file
  2. NOTE: Sometimes the browser may block downloading / installing CRX file from outside the Chrome Web Store. If so, you may need to use option 1, or download the ZIP file instead.
  3. In the URL bar, go to chrome://extensions
  4. Enable Developer mode
  5. Drag and drop the downloaded CSS debug alignment CRX file into the Extensions page
  6. When prompted, click Add extension to install CSS debug alignment.

Install ZIP file

  1. Download and unpack the CSS debug alignment ZIP file to a directory of your choice.
  2. In Chrome browser, go to chrome://extensions
  3. Enable Developer mode.
  4. Click on the Load Unpacked button.
  5. Select the directory of with the unpacked CSS debug alignment ZIP file from step 1. CSS debug alignment is now installed on your browser.

Similar extensions

Here are some Chrome extensions that are similar to CSS debug alignment:

Outliner CSS
Outliner CSS
tarah
5.00
9,000+
CSS Debugger
CSS Debugger
Mathias Meldgaard Pedersen
5.00
1,000+
DOM X-Ray
DOM X-Ray
https://nick-vincent.com
5.00
1,000+
Debug CSS
Debug CSS
Pranay Joshi
4.74
20,000+
HTML Hierarchy Visualizer
HTML Hierarchy Visualizer
steven.massola
5.00
2,000+
Layout Debugger
Layout Debugger
cdsnowden
4.00
892
Dimensions Inspect | Gridman
Dimensions Inspect | Gridman
https://fenvox.com
4.01
10,000+
HTML & CSS Design Analysis
HTML & CSS Design Analysis
https://kodemuse.dev
N/A
751
Pesticide for Chrome (without hover bar)
Pesticide for Chrome (without hover bar)
bradley.flood
4.05
80,000+
HTML Visual Validation
HTML Visual Validation
btisseo
4.38
4,000+
Differen-CSS
Differen-CSS
ptdimitry
2.00
96
TinkerCSS
TinkerCSS
Jan Baykara
3.00
154
Looksee
Looksee
Cullan Luther
5.00
564
Outliner
Outliner
Zach Baker
5.00
859
simple-debug.css
simple-debug.css
https://chrisnager.com
4.71
1,000+
CSS Filters Editor
CSS Filters Editor
http://www.clicktorelease.com
5.00
235
Div Highlighter
Div Highlighter
itsHobbes
3.29
1,000+
Div Density
Div Density
https://andersfisher.com
4.17
370
CSS Brio
CSS Brio
JRAYCV
5.00
2,000+
showHTML
showHTML
https://tech-in-check.blogspot.com
5.00
514
DevTools Classes & Atributes panel
DevTools Classes & Atributes panel
Gustavo Sillero
5.00
282
CSS Spy
CSS Spy
SoftwareSeni
3.94
3,000+
HTML Tree Generator
HTML Tree Generator
Joel Saupe
4.28
100,000+
Designer Tools
Designer Tools
https://designer.tools
4.75
70,000+