Chromeウェブインスペクタ - 左パネルのCSSパネル

Question

エレメントパネルのCSS部分を左側に移動するためにChromeウェブインスペクタ（特にhereとhere）をカスタマイズしてみました私は喜んでいませんでした。

誰もこのようなことをすることができましたか、それともその例が見られましたか？

ここで私が得ようとしているものの簡単なハッキングアップscreenshotです。

編集：私はすべてのバージョン固有の愚かさがあります念のために、クロームのバージョン18.0.1025.33 beta-mを使用しています:)

Answer 1

はあなたがChromeでウェブインスペクタスタイルすることができます知っていませんでした：Pを、ここにいくつかのCSSつまり、あなたが提供されたリンクのいずれかから

Custom.css 

---

#elements-content { 
    left: 325px !important; 
    right: 0 !important; 
} 

#elements-sidebar { 
    left: 0 !important; 
    right:auto !important; 
    left:0 !important; 
    border-right: 1px solid #404040 !important; 
} 

#elements-content[style] { /* to target the inline style */ 
    right:0 !important; 
    left:325px !important; 
} 

：あなたは、所望の結果をレンダリングしますChromeのディレクトリにあなたのCustom.cssスタイルシートに追加することができますCustom.cssスタイルシートが配置されている場所のページ：

• マックは：〜/ライブラリ/ Application \サポート/グーグル/クローム/デフォルト/ユーザー\ スタイルシート/のcustom.css

• PC：C：\ユーザー\あなたのユーザ名\のAppData \ローカル\ Googleの\クローム\ユーザー データ\既定のユーザースタイルシートのcustom.css

• のUbuntu（クロム）を\ \：〜/ .configを/クロム/デフォルト/ユーザー\ スタイルシート/カスタム。 CSS

編集：ここでは、スクリーンショット

---

は、クロームのバージョンで動作するはず固定バージョンで、

CSS 17.xxxx

バージョンでそれを試してみました

#elements-content, .scripts-views-container { left: 325px !important; right: 0 !important; } .split-view-sidebar-right { float:right !important; right:auto !important; left:0 !important; width:325px !important; } .split-view-sidebar-left { float:left !important; left:auto !important; right:0 !important; } .split-view-sidebar-left { border-right: 1px solid rgb(64%, 64%, 64%) !important; } .split-view-sidebar-left.maximized { border-left: none !important; } .split-view-sidebar-right { border-right: 1px solid rgb(64%, 64%, 64%) !important; } .split-view-sidebar-right.maximized { border-left: none !important; }