Since today in the morning I am searching for an add on for chrome or firefox which shows me the border lines(height, width) of page, so that i can test my page by resizing and watching its heights and widths in border lines.
i tried, window resizer, Web Developer and a bunch of others.. but they dont show me dynamically the borders of page in pixels during resize.
i hope, i explained it clearly
example:
Since today in the morning I am searching for an add on for chrome or firefox which shows me the border lines(height, width) of page, so that i can test my page by resizing and watching its heights and widths in border lines.
i tried, window resizer, Web Developer and a bunch of others.. but they dont show me dynamically the borders of page in pixels during resize.
i hope, i explained it clearly
example:
Share Improve this question edited Aug 25, 2013 at 10:45 doniyor asked Aug 25, 2013 at 10:36 doniyordoniyor 37.9k61 gold badges181 silver badges270 bronze badges 4- 1 You mean like this: dimensionsapp. – Jonathan Commented Aug 25, 2013 at 10:51
- @Jonathan, yes, exactly, but is there any integrated version so that i can see it in every tab i open right inside my normal browser? – doniyor Commented Aug 25, 2013 at 10:53
- You can use ctrl+shift+m on Firefox – psd2htmldepot Commented Aug 25, 2013 at 10:56
- IE devtools have a resize option under the 'Extra' tab. – Jonathan Commented Aug 25, 2013 at 10:57
2 Answers
Reset to default 4In Chrome, there is a "gear" icon to the bottom right of the development tools (right-click on any element, then "Inspect Element") that opens up the general settings. Just check "Show Rulers" in the "Elements" section, then hover on elements in the HTML code in the Elements pane.
In Firefox you can also select "Responsive design view" from the web developer menu. This allows you to resize a page and make it responsive in a much more interactive way.