How do I enable icon setting in Chrome browser? - google-chrome

How do I enable this inspect element in Google Chrome? The part that is enclosed in red box.
Because right now, by default, this is what I see with my inspect element.
Do I need to install something or this is within settings?

Your screenshots are from different browser dev tools. If m not wrong, the top one is on Firefox where the bottom one is Chrome.
The Inspector tab is similar to the Elements tab in Chrome
The Debugger tab is similar to the Sources tab in Chrome

Related

When I Open chrome inspect some element getting overlap

when open chrome some element getting overlap
like As seen in this picture
I need fix this problem
Even I have faced the same issue.
What I did is I just opened dev tools in separate window.
Click on the 3 dots icon then you can find dock side option, In dock side select the first option which will pop out the dev tools into new window.
In this image you can find the dockside option
This is how the dev tools window will open
Now you can view the entire web page as well as dev tools.

How do I Highlight Elements in Chrome Dev tools (after I've moved my mouse away)

In the Firefox dev tools, in the Rules tab that holds the CSS values, there's a super-useful little box you can click and it highlights the element on the page.
Is there a version of this in Chrome? I can't seem to see it anywhere.
Image attached from a screenshot in Firefox to show what I mean.

Chrome Dev Tools no longer lets me position to bottom

Google Chrome dev tools no longer lets me re-position it to the bottom of the page instead of the right side. Anyone know how I can re-enable this function? It makes it very difficult to use it in certain screen layouts.
I'm using Chrome v 33.0.1750.154 m
Windows 8.1
Interestingly, the opposite is true in Canary(v 35.0.1900.0 canary). In canary dev tools are stuck on the bottom and can't be re-positioned to the side.
Is there some check-box I accidentally clicked or what??
Currently I can only dock or un-dock the dev tools panel, but the option to change it's position inside the window is gone.
If you click and hold the dock/undock button you get the option to reposition.
Cmd-Shift-D also works, as I just found out

Empty area appears at the bottom of page on chrome

I have problem on my website. If I open my website with HTTPS protocol, chrome shows an empty area at the bottom of page.
You can reproduce this if follows this steps:
Open new separate incognito tab using the lastest chrome version on windows
Go to this page. It will show a message that certificate is invalid. Ignore it.
At the bottom of page should appear unused area.
Why chrome shows this empty area on my page? It will disappear if I resize window. I also tried to disable all plugins, but it didn't help.
Depending on which version of Chrome that you are using, there is a reported issue of this grey area displaying only when the "Show bookmarks" (ctrl-shift B) is selected. Here is a link to the bug report: https://code.google.com/p/chromium/issues/detail?id=139765
The issue purports to be fixed in the current version of Chrome.

How to send current page in Google Chrome to Firefox?

In Firefox I use a add-on called "Open With" which adds Chrome and Safari icons in Firefox's toolbar. If I want to open the current webpage in Firefox in one of these browsers, I just click that button and the page opens in the chosen browser in a new tab.
I would like similar functionality but in Google Chrome, to be able to send current page to other browsers, mainly to Firefox.
Does anyone know a way or a extension?
In the URL box in Chrome on the left is an icon, sheet of paper. Drag the icon to the firefox window and drop it.
The reverse also works.
If the firefox window is hidden or underneath Chrome then drag the icon to the Taskbar and over the Firefox icon, hold it for a split second and the Firefox window will be brought to the front. Then drop the icon into Firefox.
No extension that I've found yet.